Cli: [BUG] npm 7 ์ž‘์—… ๊ณต๊ฐ„ ํŒจํ‚ค์ง€ ์Šคํฌ๋ฆฝํŠธ ์‹คํ–‰

์— ๋งŒ๋“  2020๋…„ 10์›” 06์ผ  ยท  5์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: npm/cli

ํ˜„์žฌ ํ–‰๋™ :

์—ฌ๋Ÿฌ ์ž‘์—… ์˜์—ญ์ด์žˆ๋Š” ํŒจํ‚ค์ง€๊ฐ€ ์ฃผ์–ด์ง€๋ฉด npm install ๋Š” ๋ฃจํŠธ ๋ฐ ์ž‘์—… ์˜์—ญ ํŒจํ‚ค์ง€์˜ ๋ชจ๋“  ํŒจํ‚ค์ง€๋ฅผ ๋ฃจํŠธ node_modules ํ•ฉ๋‹ˆ๋‹ค. yarn๊ณผ ๋‹ฌ๋ฆฌ ์ž‘์—… ์˜์—ญ ํŒจํ‚ค์ง€์˜ ์ข…์†์„ฑ์€ ๊ฐ ์ž‘์—… ์˜์—ญ ํŒจํ‚ค์ง€ node_modules ์„ค์น˜๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์ฆ‰, ํ˜„์žฌ ์ž‘์—… ๋””๋ ‰ํ† ๋ฆฌ๊ฐ€ ํ•˜์œ„ ํŒจํ‚ค์ง€ ์ธ ๊ฒฝ์šฐ ์Šคํฌ๋ฆฝํŠธ๋ฅผ ์ง์ ‘ ์‹คํ–‰ํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค.

๋˜ํ•œ ์ž‘์—… ๊ณต๊ฐ„ ํŒจํ‚ค์ง€์—์„œ ์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‹คํ–‰ํ•˜๋Š” npm workspace ๋ช…๋ น์ด ์•„์ง์—†๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค ( yarn workspace ๊ณผ ๋น„๊ต).

์˜ˆ์ƒ๋˜๋Š” ๋™์ž‘ :

์ด ๋ธ”๋กœ๊ทธ ๊ฒŒ์‹œ๋ฌผ์—์„œ๋Š” npm ์ž‘์—… ์˜์—ญ ๊ธฐ๋Šฅ์ด yarn๊ณผ ์œ ์‚ฌํ•˜๊ฒŒ ์ž‘๋™ํ•ด์•ผํ•œ๋‹ค๊ณ  ์–ธ๊ธ‰ํ–ˆ์Šต๋‹ˆ๋‹ค.

npm v7์€ ์ตœ์†Œํ•œ Yarn์˜ ์ž‘์—… ๊ณต๊ฐ„ ๊ธฐ๋Šฅ์„ ์ง€์›ํ•˜๋ฉฐ v8์˜ ๊ณ ๊ธ‰ ์ž‘์—… ๊ณต๊ฐ„ ๊ธฐ๋Šฅ์„์œ„ํ•œ ๋‹จ๊ณ„๋ฅผ ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค.
https://blog.npmjs.org/post/186983646370/npm-cli-roadmap-summer-2019

๋‹ค์Œ ์ค‘ ํ•˜๋‚˜๋ฅผ ์ˆ˜ํ–‰ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

  1. npm workspace @me/workspace-package1 my-script ๋ฅผ ์‹คํ–‰ํ•˜์—ฌ ์ž‘์—… ์˜์—ญ ํŒจํ‚ค์ง€ @me/workspace-package1 ์—์„œ my-script ์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‹คํ–‰ํ•ฉ๋‹ˆ๋‹ค (์˜ˆ : packages / package1์— ์žˆ์Œ).
  2. ์ž‘์—… ๊ณต๊ฐ„ ํŒจํ‚ค์ง€๋กœ cdํ•˜๊ณ  ๊ฑฐ๊ธฐ์—์„œ ์Šคํฌ๋ฆฝํŠธ๋ฅผ ์ง์ ‘ ์‹คํ–‰ํ•˜์‹ญ์‹œ์˜ค : cd packages/package1 && npm run my-script

์žฌํ˜„ ๋‹จ๊ณ„ :

์ž‘์—… ๊ณต๊ฐ„ ํŒจํ‚ค์ง€๋ฅผ ์‹คํ—˜ํ•˜๊ณ  yarn๊ณผ npm7์„ ๋น„๊ตํ•˜๊ธฐ ์œ„ํ•ด ์ž‘์—… ๊ณต๊ฐ„ ๋†€์ดํ„ฐ๋ฅผ ๋งŒ๋“ค์—ˆ์Šต๋‹ˆ๋‹ค.
https://github.com/fabb/npm7-workspaces

  1. ์ €์žฅ์†Œ์—์„œ npm install (์„ฑ๊ณต)
  2. ํ„ฐ๋ฏธ๋„์—์„œ cd applications/app1 && npm run build
  3. tsc ์„ ์ฐพ์„ ์ˆ˜ ์—†๊ธฐ ๋•Œ๋ฌธ์— ๋นŒ๋“œ๊ฐ€ ์‹คํŒจํ•ฉ๋‹ˆ๋‹ค.

์ด์ œ ์›์‚ฌ๋กœ ์‹œ๋„ํ•˜์‹ญ์‹œ์˜ค.

  1. ์ €์žฅ์†Œ์—์„œ yarn (์„ฑ๊ณต)
  2. ํ„ฐ๋ฏธ๋„์—์„œ cd applications/app1 && yarn run build
  3. ๋นŒ๋“œ ์„ฑ๊ณต

๋˜๋Š” ์›์‚ฌ๋กœ :

  1. ์ €์žฅ์†Œ์—์„œ yarn (์„ฑ๊ณต)
  2. ํ„ฐ๋ฏธ๋„์—์„œ yarn workspace @fabb/app1 build
  3. ๋นŒ๋“œ ์„ฑ๊ณต

ํ™˜๊ฒฝ:

  • ์šด์˜์ฒด์ œ : macOS Catalina 10.15.7
  • ๋…ธ๋“œ : v12.18.0
  • npm : 7.0.0-rc.2

๊ด€๋ จ

์ž‘์—… ๊ณต๊ฐ„ ์šฉ RFC : https://github.com/npm/rfcs/blob/latest/accepted/0026-workspaces.md

Bug Enhancement Release 7.x

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

์ด์ƒ์ ์ด์ง€๋Š” ์•Š์ง€๋งŒ; ์ด ๋ฌธ์ œ๊ฐ€ ํ•ด๊ฒฐ ๋  ๋•Œ๊นŒ์ง€ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์€ --prefix ์˜ต์…˜์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค ( docs ์ฐธ์กฐ).

์˜ˆ๋ฅผ ๋“ค์–ด @fabb ์˜ ๋‹จ๊ณ„๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ repo npm7-workspaces ๋กœ ์žฌํ˜„ํ•˜๊ณ  2 ๋‹จ๊ณ„์˜ ๋ช…๋ น์„ ๋‹ค์Œ์œผ๋กœ ๋Œ€์ฒดํ•ฉ๋‹ˆ๋‹ค.

npm run --prefix applications/app1 build

๋นŒ๋“œ ์„ฑ๊ณต :

npm7-workspaces % npm -v
7.0.2

npm7-workspaces % npm run --prefix applications/app1 build

> @fabb/[email protected] build
> tsc index.ts

npm7-workspaces % echo $?

0

๋ชจ๋“  5 ๋Œ“๊ธ€

์ž‘์—… ๊ณต๊ฐ„ RFC์— ๋Œ€ํ•œ ๋งํฌ๋Š” https://github.com/npm/rfcs/blob/latest/implemented/0026-workspaces.md์ž…๋‹ˆ๋‹ค.

npm7 ์ž‘์—… ๊ณต๊ฐ„ ๊ธฐ๋Šฅ๊ณผ ๊ด€๋ จ๋œ ์งˆ๋ฌธ์ด ์žˆ์Šต๋‹ˆ๋‹ค. ํŠน์ • ์ž‘์—… ๊ณต๊ฐ„์—๋งŒ ํŒจํ‚ค์ง€๋ฅผ ์„ค์น˜ํ•ด์•ผํ•˜๋Š” ๊ฒฝ์šฐ์ด๋ฅผ ์ˆ˜ํ–‰ํ•˜๋Š” npm ๋ช…๋ น์€ ๋ฌด์—‡์ž…๋‹ˆ๊นŒ? Yarn๊ณผ Lerna๋Š” ๋ชจ๋‘ ์ด๊ฒƒ์„ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค.

๋‹ค์Œ ์ž‘์—… ๊ณต๊ฐ„์„ ๊ฐ€์ •ํ•˜์‹ญ์‹œ์˜ค.

{
  "workspaces": ["packages/*"]
}
+ -- packages
  + -- package-a
  + -- package-b

์‹ค

$ yarn workspace package-a add react

๋ ˆ๋ฅด ๋‚˜

lerna add๋Š” lerna์˜ ํ•„ํ„ฐ ์˜ต์…˜์„ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค.

$ lerna add react --scope=package-a

์งˆ๋ฌธ. yarn๊ณผ ๊ฐ™์€ npm ์ž‘์—… ๊ณต๊ฐ„๋„ ๋ฃจํŠธ ํŒจํ‚ค์ง€์— "private": true ๊ฐ€ ์žˆ์–ด์•ผํ•ฉ๋‹ˆ๊นŒ? ๋ฌธ์„œ์—๋Š” ์ด์— ๋Œ€ํ•œ ์ •๋ณด๊ฐ€ ํฌํ•จ๋˜์–ด์•ผํ•ฉ๋‹ˆ๋‹ค.

์ด์ƒ์ ์ด์ง€๋Š” ์•Š์ง€๋งŒ; ์ด ๋ฌธ์ œ๊ฐ€ ํ•ด๊ฒฐ ๋  ๋•Œ๊นŒ์ง€ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์€ --prefix ์˜ต์…˜์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค ( docs ์ฐธ์กฐ).

์˜ˆ๋ฅผ ๋“ค์–ด @fabb ์˜ ๋‹จ๊ณ„๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ repo npm7-workspaces ๋กœ ์žฌํ˜„ํ•˜๊ณ  2 ๋‹จ๊ณ„์˜ ๋ช…๋ น์„ ๋‹ค์Œ์œผ๋กœ ๋Œ€์ฒดํ•ฉ๋‹ˆ๋‹ค.

npm run --prefix applications/app1 build

๋นŒ๋“œ ์„ฑ๊ณต :

npm7-workspaces % npm -v
7.0.2

npm7-workspaces % npm run --prefix applications/app1 build

> @fabb/[email protected] build
> tsc index.ts

npm7-workspaces % echo $?

0

์งˆ๋ฌธ. yarn๊ณผ ๊ฐ™์€ npm ์ž‘์—… ๊ณต๊ฐ„๋„ ๋ฃจํŠธ ํŒจํ‚ค์ง€์— "private": true ๊ฐ€ ์žˆ์–ด์•ผํ•ฉ๋‹ˆ๊นŒ? ๋ฌธ์„œ์—๋Š” ์ด์— ๋Œ€ํ•œ ์ •๋ณด๊ฐ€ ํฌํ•จ๋˜์–ด์•ผํ•ฉ๋‹ˆ๋‹ค.

@detj ์•„๋‹ˆ, ๋‚ด๊ฐ€ ํ…Œ์ŠคํŠธ ํ•œ ํ•œ ๊ทธ๋ ‡์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰