Programming/JavaScript

npm vs yarn

seulye 2023. 11. 24. 09:05

 

 

https://www.daleseo.com/js-package-manager/

 

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ํŒจํ‚ค์ง€ ๋งค๋‹ˆ์ €: npm vs. Yarn

Engineering Blog by Dale Seo

www.daleseo.com

https://joshua1988.github.io/vue-camp/package-manager/npm-vs-yarn.html#yarn

 

NPM vs Yarn | Cracking Vue.js

npm๊ณผ yarn npm๊ณผ yarn์€ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋Ÿฐํƒ€์ž„ ํ™˜๊ฒฝ์ธ ๋…ธ๋“œ(Node.js)์˜ ํŒจํ‚ค์ง€ ๊ด€๋ฆฌ์ž์ž…๋‹ˆ๋‹ค. ์ „ ์„ธ๊ณ„์˜ ๊ฐœ๋ฐœ์ž๋“ค์ด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ๋งŒ๋“  ๋‹ค์–‘ํ•œ ํŒจํ‚ค์ง€๋ฅผ npm ์˜จ๋ผ์ธ ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค (opens new window)์— ์˜ฌ

joshua1988.github.io

 

ํŒจํ‚ค์ง€ ๋งค๋‹ˆ์ €(package manager)๋Š” ํ”„๋กœ์ ํŠธ๊ฐ€ ์˜์กดํ•˜๊ณ  ์žˆ๋Š” ํŒจํ‚ค์ง€๋ฅผ ํšจ๊ณผ์ ์œผ๋กœ ์„ค์น˜, ๊ฐฑ์‹ , ์‚ญ์ œํ•  ์ˆ˜ ์žˆ๋„๋ก ๋„์™€์ฃผ๋Š” ๊ด€๋ฆฌ ๋„๊ตฌ์ž…๋‹ˆ๋‹ค. 

 

npm

npm(Node Package Manager์˜ ์•ฝ์ž์ธ๋ฐ ํŠน์ดํ•˜๊ฒŒ ๋ชจ๋‘ ์†Œ๋ฌธ์ž๋กœ ์”๋‹ˆ๋‹ค)์€ Node.js์˜ ํ‘œ์ค€ ํŒจํ‚ค์ง€ ๋งค๋‹ˆ์ €๋กœ์„œ Node.js ๋Ÿฐํƒ€์ž„์„ ์„ค์น˜ํ•˜๋ฉด ๋ฌด์กฐ๊ฑด ๋”ธ๋ ค์˜ค๋Š” ๊ธฐ๋ณธ ํŒจํ‚ค์ง€ ๋งค๋‹ˆ์ €์ž…๋‹ˆ๋‹ค.

 

yarn 

Yarn(Yet Another Resource Negotiator)์€ Facebook์—์„œ 2016๋…„์— ๋งŒ๋“  ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ํŒจํ‚ค์ง€ ๋งค๋‹ˆ์ €์ž…๋‹ˆ๋‹ค. npm ๋ณด๋‹ค ํ›จ์”ฌ ๋น ๋ฅด๊ณ  Workspaces์™€ ๊ฐ™์€ ์ถ”๊ฐ€์ ์ธ ๊ธฐ๋Šฅ๊นŒ์ง€ ์ œ๊ณตํ•ด์„œ ์ถœ์‹œํ•˜์ง€๋งˆ์ž ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์ปค๋ฎค๋‹ˆํ‹ฐ์—์„œ ํฐ ์ฃผ๋ชฉ์„ ๋ฐ›์•˜์Šต๋‹ˆ๋‹ค. ๋‹น์‹œ npm ๋Œ€๋น„ Yarn์˜ ๊ฐ€์žฅ ํฐ ๊ฐ•์ ์€ yarn.lock ํŒŒ์ผ์„ ํ†ตํ•ด ํŒจํ‚ค์ง€ ๋ฒ„์ „ ์ž ๊ธˆ์„ ์ง€์›ํ•˜๋Š” ๊ฒƒ์ด์˜€๋Š”๋ฐ์š”. ์ด๋ฅผ ํ†ตํ•ด ํ”„๋กœ์ ํŠธ์—์„œ ์˜์กดํ•˜๋Š” ๋ชจ๋“  ํŒจํ‚ค์ง€๋ฅผ ์–ด๋А ํ™˜๊ฒฝ์—์„œ๋“  ํ•ญ์ƒ ๋™์ผํ•œ ๋ฒ„์ „์œผ๋กœ ์„ค์น˜ํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋งŒ๋“ค์–ด์คฌ์Šต๋‹ˆ๋‹ค.

 

์ฐจ์ด์ 

์‚ฌ์šฉ์ž ์ž…์žฅ์—์„œ ๋‘ ํŒจํ‚ค์ง€์˜ ๊ฐ€์žฅ ๋‘๋“œ๋Ÿฌ์ง€๋Š” ์ฐจ์ด์ ์€ ํŒจํ‚ค์ง€ ๋ฒ„์ „ ์ž ๊ธˆ์„ ์œ„ํ•ด npm์€ package-lock.json ํŒŒ์ผ์„, Yarn์€ yarn.lock ํŒŒ์ผ์„ ์‚ฌ์šฉํ•œ๋‹ค๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค. ๋˜ํ•œ Yarn์˜ CLI(Command Line Interface)๋Š” ๋Œ€๋ถ€๋ถ„์˜ npm์˜ ๋ช…๋ น์–ด(command)๋ฅผ ๋ชจ๋ฐฉํ•˜๊ณ  ์žˆ์ง€๋งŒ ์กฐ๊ธˆ์”ฉ ๋‹ค๋ฅธ ๋ถ€๋ถ„๋„ ์žˆ๊ธฐ ๋•Œ๋ฌธ์— ์ฃผ์˜๊ฐ€ ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค. ๋Œ€ํ‘œ์ ์œผ๋กœ npm์€ ์ƒˆ๋กœ์šด ํŒจํ‚ค์ง€๋ฅผ ์„ค์น˜ํ•  ๋•Œ, npm install ๋ช…๋ น์–ด๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๋ฐ˜๋ฉด์— Yarn์€ yarn add ๋ช…๋ น์–ด๋ฅผ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค.

 

Yarn์˜ ๊ฐ€์žฅ ํฐ ๋‹จ์ ์„ ๋ฝ‘๋Š”๋‹ค๋ฉด Node.js์™€ ํ•จ๊ป˜ ์„ค์น˜๋˜๋Š” npm๊ณผ ๋‹ฌ๋ฆฌ ๊ฐœ๋ฐœ์ž์˜ ์ปดํ“จํ„ฐ๋‚˜ CI(Continuous integration) ์„œ๋ฒ„์— ๋ณ„๋„๋กœ Yarn์„ ๋”ฐ๋กœ ์„ค์น˜๋ฅผ ํ•ด์•ผํ•œ๋‹ค๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค. ๊ทธ๋Ÿผ์—๋„ ๋ถˆ๊ตฌํ•˜๊ณ  Yarn์€ ํ„ฐ๋ฏธ๋„์—์„œ ๋ช…๋ น์–ด์˜ ์‹คํ–‰ ๊ฒฐ๊ณผ๊ฐ€ npm๋ณด๋‹ค ์ข€ ๋” ์˜ˆ์˜๊ฒŒ ๋‚˜์˜ค๋Š” ๋“ฑ ๊ฐœ๋ฐœ์ž ๊ฒฝํ—˜ ์ธก๋ฉด์—์„œ ์•„์ง๋„ npm ๋Œ€๋น„ ๋งค๋ ฅ์ ์ธ ๋ถ€๋ถ„์ด ์กด์žฌํ•˜๋Š” ๊ฒƒ๋„ ์‚ฌ์‹ค์ž…๋‹ˆ๋‹ค.

 

 

 

์†๋„

npm๊ณผ yarn์˜ ์ฃผ์š” ์ฐจ์ด์  ์ค‘ ํ•˜๋‚˜๋Š” ํŒจํ‚ค์ง€ ์„ค์น˜ ํ”„๋กœ์„ธ์Šค๋ฅผ ์ฒ˜๋ฆฌํ•˜๋Š” ๋ฐฉ๋ฒ•์ž…๋‹ˆ๋‹ค. npm์€ ํŒจํ‚ค์ง€๋ฅผ ํ•œ ๋ฒˆ์— ํ•˜๋‚˜์”ฉ ์ˆœ์ฐจ์ ์œผ๋กœ ์„ค์น˜ํ•ฉ๋‹ˆ๋‹ค. ๊ทธ์— ๋น„ํ•ด yarn์€ ์—ฌ๋Ÿฌ ํŒจํ‚ค์ง€๋ฅผ ๋™์‹œ์— ๊ฐ€์ ธ์˜ค๊ณ  ์„ค์น˜ํ•˜๋„๋ก ์ตœ์ ํ™”๋˜์–ด ์žˆ์–ด ํŒจํ‚ค์ง€ ์„ค์น˜ ์†๋„ ์ธก๋ฉด์—์„œ yarn์ด npm๋ณด๋‹ค ๋น ๋ฆ…๋‹ˆ๋‹ค.

๋ณด์•ˆ

yarn์€ ๋ณด์•ˆ ์ธก๋ฉด์—์„œ npm๋ณด๋‹ค ๋” ์•ˆ์ „ํ•œ ๊ฒƒ์œผ๋กœ ์•Œ๋ ค์ ธ ์žˆ์Šต๋‹ˆ๋‹ค. npm์€ ์ž๋™์œผ๋กœ ํŒจํ‚ค์ง€์— ํฌํ•จ๋œ ๋‹ค๋ฅธ ํŒจํ‚ค์ง€ ์ฝ”๋“œ๋ฅผ ์‹คํ–‰ํ•ฉ๋‹ˆ๋‹ค. ์ด๋กœ ์ธํ•ด ๋ณด์•ˆ ์‹œ์Šคํ…œ์— ๋ช‡ ๊ฐ€์ง€ ์ทจ์•ฝ์„ฑ์ด ๋ฐœ์ƒํ•˜๋ฉฐ ๋‚˜์ค‘์— ์‹ฌ๊ฐํ•œ ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ฐ˜๋ฉด์— yarn์€ yarn.lock ๋˜๋Š” package.jsonํŒŒ์ผ์— ์žˆ๋Š” ํŒŒ์ผ๋งŒ์„ ์„ค์น˜ํ•ฉ๋‹ˆ๋‹ค. ๋ณด์•ˆ์€ yarn์˜ ํ•ต์‹ฌ ๊ธฐ๋Šฅ ์ค‘ ํ•˜๋‚˜์ด์ง€๋งŒ ์ตœ๊ทผ npm์˜ ์—…๋ฐ์ดํŠธ์—์„œ npm์˜ ๋ณด์•ˆ ์—…๋ฐ์ดํŠธ๋„ ํฌ๊ฒŒ ํ–ฅ์ƒ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.