<div id="readability-page-1" class="page"><div>yarn berry (with pnp) 를 사용해 모노레포를 구축하고, 기존프로젝트들을 migration 해본다.
<h2 id="프로젝트-생성">프로젝트 생성</h2>
<ol>
<li>모노레포 프로젝트 생성</li>
</ol>
<pre><code>npm i -g yarn
cd {monorepo_directory}
yarn init -2 </code></pre>
<ol start="2">
<li><code>package.json</code> 생성</li>
</ol>
<pre><code>{
 //... init 통해 생성된 내용 유지
 "workspaces": [
 // 프로젝트들을 담을 디렉토리를 선언, 여러 디렉토리 지정 가능 (like "apps/*")
 "packages/*",
 ]
}</code></pre>
<ol start="3">
<li>전역으로 적용할 설정파일 추가</li>
</ol>
<ul>
<li>.eslintrc.js</li>
<li>tsconfig.json</li>
<li>.prettier</li>
<li>기타 등등..</li>
</ul>
<ol start="4">
<li>pnp 방식사용을 위한 <code>.yarnrc.yml</code> 파일 수정</li>
</ol>
<pre><code># ... 기존내용유지 ...
nodeLinker: pnp</code></pre>
<ol start="5">
<li>typescript 설치</li>
</ol>
<pre><code>yarn add -D typescript</code></pre>
<ol start="6">
<li>vscode에서 pnp 환경 사용을 위한 sdk 다운/실행</li>
</ol>
<pre><code>yarn dlx @yarnpkg/sdks vscode</code></pre>
<h2 id="workspace-추가">workspace 추가</h2>
<ol>
<li>존재하는 프로젝트 (<code>project_a</code> 라 지칭)를 worksapce 디렉토리 하위에 copy, paste 한다.</li>
</ol>
<pre><code>cp -r proejct_a {monorepo_directory}/packages</code></pre>
<ol start="2">
<li><code>proejct_a/package.json</code> 수정</li>
</ol>
<pre><code>// {monorepo_directory}/packages/proejct_a/package.json
{
 "name": "proejct_a",
 "packageManager": "yarn@4.5.3",
}</code></pre>
<ol start="3">
<li><code>{monorepo_directory}/package.json</code> 수정 
편의를 위해 sciprt를 통해 alias 를 만들어두자.</li>
</ol>
<pre><code>{
 //...
 "scripts": {
 "project_a": "yarn workspace proejct_a"
 },</code></pre>
<ol start="4">
<li>패키지 설치</li>
</ol>
<pre><code>yarn project_a install</code></pre></div></div>

ginameee.log

Jangchun Lee

yarn berry (with pnp) 를 사용해 모노레포를 구축하고, 기존프로젝트들을 migration 해본다.
프로젝트 생성
모노레포 프로젝트 생성
npm i -g yarn
cd {monorepo_directory}
yarn init -2 
package.json 생성
{
//... init 통해 생성된 내용 유지
"workspaces": [
 // 프로젝트들을 담을 디렉토리를 선언, 여러 디렉토리 지정 가능 (like "apps/*")
 "packages/*",
]
}
전역으로 적용할 설정파일 추가
.eslintrc.js
tsconfig.json
.prettier
기타 등등..
pnp 방식사용을 위한 .yarnrc.yml 파일 수정
# ... 기존내용유지 ...
nodeLinker: pnp
typescript 설치
yarn add -D typescript
vscode에서 pnp 환경 사용을 위한 sdk 다운/실행
yarn dlx @yarnpkg/sdks vscode
workspace 추가
존재하는 프로젝트 (project_a 라 지칭)를 worksapce 디렉토리 하위에 copy, paste 한다.
cp -r proejct_a {monorepo_directory}/packages
proejct_a/package.json 수정
// {monorepo_directory}/packages/proejct_a/package.json
{
"name": "proejct_a",
"packageManager": "yarn@4.5.3",
}
{monorepo_directory}/package.json 수정
편의를 위해 sciprt를 통해 alias 를 만들어두자.
{
//...
"scripts": {
 "project_a": "yarn workspace proejct_a"
},
패키지 설치
yarn project_a install

모노레포 구축/이관 (작성중)

댓글