Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
npm or yarn, that is a problem.
Search
Yosuke Furukawa
PRO
August 26, 2018
Programming
18
2.4k
npm or yarn, that is a problem.
LL.pm で発表した npm と yarn の話です。
Yosuke Furukawa
PRO
August 26, 2018
Tweet
Share
More Decks by Yosuke Furukawa
See All by Yosuke Furukawa
デザインシステムが必須の時代に
yosuke_furukawa
PRO
2
150
Node.js, Deno, Bun 最新動向とその所感について
yosuke_furukawa
PRO
10
4.3k
Welcome JSConf.jp 2024
yosuke_furukawa
PRO
1
4.3k
tc39 x jsconf.jp Panel Discussion 2024
yosuke_furukawa
PRO
0
270
Removing Corepack
yosuke_furukawa
PRO
9
1.7k
JavaScript Runtime とはなにか
yosuke_furukawa
PRO
15
2.8k
Strip Types と Storage
yosuke_furukawa
PRO
4
430
Module Harmony について
yosuke_furukawa
PRO
3
1.8k
LTのやり方
yosuke_furukawa
PRO
16
2.7k
Other Decks in Programming
See All in Programming
Let's Write a Train Tracking Algorithm
twocentstudios
0
220
TokyoR#119 bignners session2 Visualization
kotatyamtema
0
130
2分台で1500examples完走!爆速CIを支える環境構築術 - Kaigi on Rails 2025
falcon8823
3
2.2k
iOSアプリの信頼性を向上させる取り組み/ios-app-improve-reliability
shino8rayu9
0
110
CSC305 Lecture 03
javiergs
PRO
0
220
Learn CPU architecture with Assembly
akkeylab
1
1.3k
育てるアーキテクチャ:戦い抜くPythonマイクロサービスの設計と進化戦略
fujidomoe
1
140
Platformに“ちょうどいい”責務ってどこ? 関心の熱さにあわせて考える、責務分担のプラクティス
estie
2
510
大規模アプリにおけるXcode Previews実用化までの道のり
ikesyo
0
940
Swiftビルド弾丸ツアー - Swift Buildが作る新しいエコシステム
giginet
PRO
0
1.5k
Introducing ReActionView: A new ActionView-Compatible ERB Engine @ Kaigi on Rails 2025, Tokyo, Japan
marcoroth
3
650
Server Less Code More - コードを書かない時代に生きるサーバーレスデザイン / server-less-code-more
gawa
5
1.9k
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
140
34k
Music & Morning Musume
bryan
46
6.8k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.7k
Building Adaptive Systems
keathley
43
2.8k
Docker and Python
trallard
46
3.6k
What's in a price? How to price your products and services
michaelherold
246
12k
Done Done
chrislema
185
16k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
The Power of CSS Pseudo Elements
geoffreycrofte
78
6k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
14k
Transcript
npm or yarn , that is a problem. 2018/08/26 @
LL.pm
Twitter: @yosuke_furukawa Github: yosuke-furukawa
None
FAQ
Q. npm ͱ yarn ͬͯͲͬͪ ͬͨΒ͍͍ΜͰ͔͢ʁ
A. ͍ɺͲ͍͍ͬͪͬͯ Μ͡Όͳ͍Ͱ͔͢ͶʢຊԻʣ ΈΜͳҧͬͯΈΜͳ͍͍
ͲͬͪύοέʔδΛཧ͢ ΔػೳͦΖͬͯΔɻ
ͨͩ·͊ͦΕ͚ͩݴͬͯಀ ͛ͳͷͰɺҰԠ໌֬ʹࠩผԽ ͞ΕͯΔ෦Λհ͢Δ
ύϑΥʔϚϯε
ܭଌͯ͠Έͨ (ͲͪΒcache͠ͳ͍ঢ়گ)
None
yarnͷউར
ܭଌͯ͠Έͨ (cacheΛ༗ޮʹͨ͋͠ͱͷ݁Ռ)
yarnͷউར
ͳΜͱͳ͘ମײͱ͋ͬͯΔɻ ZBSO͕͖ͳਓେମ1FSGPSNBODF ͕͍ͱ͍͏͜ͱͰͬͯΔ
npm ci
npm ci $*$%Ͱ͏ͨΊʹ༨ܭͳॲཧΛ͠ͳ͍ɺͨͩϥΠϒϥ ϦΛθϩ͔Βऔಘ͢Δ͜ͱʹಛԽͨ͠ػೳ
npm ci ͍
yarnͷ͕جຊతʹߴ npmͷ͕͍͕ɺCIͰ yarnΑΓߴ
yarn։ൃ༻్ʹ͍͍ͯΔ npm։ൃɾӡ༻ͰͦΕͧΕ ίϚϯυΛ͚͍ͯΔ
ػೳ ʢجຊతʹ΄΅compatibleʣ
yarnʹ͋ͬͯnpmʹͳ͍ػೳ
yarn licenses list
ґଘϥΠϒϥϦͷϥΠηϯε͕ ҰཡͰ͖Δػೳ $ yarn licenses list yarn licenses v1.9.4 !"
(BSD-2-Clause OR MIT OR Apache-2.0) # $"
[email protected]
# !" URL: https://github.com/dominictarr/rc.git # !" VendorName: Dominic Tarr # $" VendorUrl: dominictarr.com !" (GPL-2.0 OR MIT) # $"
[email protected]
# !" URL: https://github.com/faisalman/ua-parser-js.git # !" VendorName: Faisal Salman # $" VendorUrl: http://github.com/faisalman/ua-parser-js !" (MIT AND BSD-3-Clause) # $"
[email protected]
# !" URL: git://github.com/crypto-browserify/sha.js.git # !" VendorName: Dominic Tarr # $" VendorUrl: https://github.com/crypto-browserify/sha.js
yarn upgrade-interactive
ґଘϥΠϒϥϦͷߋ৽Λରܕ γΣϧͰߦ͑Δػೳ
npmʹ͋ͬͯyarnʹͳ͍ػೳ
npm audit
ґଘϥΠϒϥϦͰ੬ऑੑ͕ใࠂ ͞Ε͍ͯͳ͍͔Λࠪ͢Δػೳ $ npm audit === npm audit security report
=== # Run npm install --save-dev
[email protected]
to resolve 14 vulnerabilities SEMVER WARNING: Recommended action is a potentially breaking change %"""""""""""""""&""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""' # Low # Prototype Pollution # !"""""""""""""""("""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""") # Package # lodash # !"""""""""""""""("""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""") # Dependency of # nyc [dev] # !"""""""""""""""("""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""") # Path # nyc > istanbul-lib-instrument > babel-generator > # # # babel-types > lodash # !"""""""""""""""("""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""") # More info # https://nodesecurity.io/advisories/577 # $"""""""""""""""*""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""+
࠷ۙηΩϡϦςΟ͕͍ʢ ͍ʣ
͔͠npm auditnpmಠࣗͷػೳͱͯ͠ ఏڙ͞ΕͯΔʢଞͷαʔϏεͰ͑ͳ͍ʣ
yarn։ൃπʔϧͱͯ͠༏ल npmӡ༻πʔϧͱͯ͠༏ल
᠘ ʢ͍ͬͯͯҾ͔͔ͬΔϙΠϯτʣ
yarn ͷ᠘
ॏෳϞδϡʔϧΛআ͢Δػ ೳ͕npmͱcompatibleͳಈ ͖Λ͠ͳ͍ɻ
yarn, npm ͱʹॏෳͨ͠Ϟδϡʔ ϧ͕͋ͬͨΒτοϓϨϕϧʹ࡞Δ // ͜͏͍͏ґଘ͕ؔ͋ͬͨΒ app (lib_Aͱlib_Bʹґଘ)/ node_modules/ lib_A(v1)
(lib_B(v1)ʹґଘ)/ lib_B(v1) (lib_C(v1)ʹґଘ)/ lib_C (v1)/ lib_B(v2) (lib_C(v1)ʹґଘ)/ lib_C (v1)/ // CΛҰͭʹͯ͠ɺ֊ߏΛઙ͘͢Δػೳ(dedupeͱݺΕΔ) app/ node_modules/ lib_A (v1)/ lib_B(v1)/ lib_B(v2)/ lib_C(v1)/
yarnͷ߹جຊ͜ͷ dedupe͕ಈ͕͘ɺᘳ͡Ό ͳ͍ɻ https://github.com/yarnpkg/yarn/issues/6070
yarn dedupeෆશ // dedupe͕ෆશͩͱ͜͏ͳΔɻ app/ node_modules/ lib_A (v1)/ lib_B(v1)/ lib_C(v1)/
lib_B(v2)/ lib_C(v1)/ ΄ͱΜͲͷέʔεͰʹͳΒͳ͍͕ɺ$#ͷٯ ࢀর͕͋Δͱ/(
࣮ࡍʹwebpackϞδϡʔϧ ͱͦͷґଘͰҰճNGʹͳͬ ͨɻ
npm ͷ᠘
npm install ͰຖճlockϑΝΠ ϧॻ͖͑ͯ͘Δ
package-lockϑΝΠϧॻ͖͑ Δ $ npm install $ git diff - package-lock.json
(!! npm install ͚ͨͩ͠ͳͷʹϩοΫϑΝΠϧ͕ॻ͖Θͬ ͯΔ !!)
όάͱͯ͠ೝࣝ͞ΕͯΔ͕ɺ ·ͩͬͯͳ͍ɻ
None
package-lockϑΝΠϧॻ͖͑ Δ // workaround $ npm install --nosave OR $
npm ci // npm install —nosave option Λ͚ͭΔͱͦͷλΠϛϯάͰpackage-lock࡞ Βͳ͍ɻ // npm ci package-lock.json͔Βμϯϩʔυ͢ΔҎ֎ͷҰΛ͠ͳ͍ɻ
yarnCLI͕ͩރΕͯͳ͍ npmlockͷ෦ʹ·ͩएׯ ͷই͕͋Δɻ
·ͱΊ • ੑೳ • yarn ͷ͕جຊతʹ͍ • npm ciߴ •
ػೳ • yarnͷ͕։ൃ໘Ͱخ͍͠ػೳ͕ଟ͍ • npmͷ͕ӡ༻໘ʢಛʹηΩϡϦςΟʣͰخ͍͠ػೳ͕ଟ͍ • ᠘ • yarn => deduce ͍ • npm => lockfileউखʹॻ͖͑ͪΌ͏
Q. npm ͱ yarn ͬͯͲͬͪ ͬͨΒ͍͍ΜͰ͔͢ʁ
(ੑೳతʹyarnͷ͕͍͠ɺ ศརίϚϯυ͋Δ͚Ͳɺ npmͷ͕ηΩϡΞͩ͠ɺރΕ ͯΔ͠͏ʔʔΜ…)
A. ͖ͳͷͬͨΒ͍͍Μ͡Ό ͳ͍Ͱ͔͢Ͷ (^^)