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
npm3 ❓
Search
Daijiro Wachi
August 31, 2015
Programming
18
13k
npm3 ❓
Daijiro Wachi
August 31, 2015
Tweet
Share
More Decks by Daijiro Wachi
See All by Daijiro Wachi
OSS開発における合意形成にJavaScriptで参加し、変化を起こす / front-end-lounge-1
watilde
6
3.2k
amplify-cliで追加したfunctionに 環境変数・シークレットを設定する機能が どのように実現されたか / amplify-env-vars
watilde
0
1.4k
Amplify Japan User Group and OSS
watilde
0
1.2k
Web VitalsとJavaScriptエラーの可視化 - フロントエンドにおけるObservabilityとは / visualize-web-vitals-and-javascript-error
watilde
6
2.8k
Firefighting planner
watilde
1
92
Doctor Wombat - A debug guide to using npm.
watilde
0
530
Asynchronous wombats - some of the communication issues from our differences we face on GitHub
watilde
0
550
Write a song in JavaScript
watilde
3
770
npm update -g npm
watilde
5
2.9k
Other Decks in Programming
See All in Programming
サイトを作ったらNFCタグキーホルダーを爆速で作れ!
yuukis
0
390
Nuances on Kubernetes - RubyConf Taiwan 2025
envek
0
180
State of CSS 2025
benjaminkott
1
110
Microsoft Orleans, Daprのアクターモデルを使い効率的に開発、デプロイを行うためのSekibanの試行錯誤 / Sekiban: Exploring Efficient Development and Deployment with Microsoft Orleans and Dapr Actor Models
tomohisa
0
140
書き捨てではなく継続開発可能なコードをAIコーディングエージェントで書くために意識していること
shuyakinjo
1
290
フロントエンドのmonorepo化と責務分離のリアーキテクト
kajitack
2
120
一人でAIプロダクトを作るための工夫 〜技術選定・開発プロセス編〜 / I want AI to work harder
rkaga
12
2.7k
AIエージェント開発、DevOps and LLMOps
ymd65536
1
250
Scale out your Claude Code ~自社専用Agentで10xする開発プロセス~
yukukotani
9
2.3k
Comparing decimals in Swift Testing
417_72ki
0
170
オホーツクでコミュニティを立ち上げた理由―地方出身プログラマの挑戦 / TechRAMEN 2025 Conference
lemonade_37
2
480
CEDEC2025 長期運営ゲームをあと10年続けるための0から始める自動テスト ~4000項目を50%自動化し、月1→毎日実行にした3年間~
akatsukigames_tech
0
140
Featured
See All Featured
Designing for Performance
lara
610
69k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Navigating Team Friction
lara
188
15k
The Invisible Side of Design
smashingmag
301
51k
Docker and Python
trallard
45
3.5k
It's Worth the Effort
3n
186
28k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Git: the NoSQL Database
bkeepers
PRO
431
65k
[RailsConf 2023] Rails as a piece of cake
palkan
56
5.8k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
Transcript
❓ @watilde 2015/08/31 - NodeֶԂ 17࣌ݶ
whoami • Daijiro Wachi - @watilde • Front/Back End Engineer
• interested in npm / V8 / flyjs
beta released at 2015-06-25
Table of contents • Why npm@3? • notes • breaking
changes • new features • v3.1 - v3.3: Minor updates
Why npm@3? • converting the CLI to an API •
dependency tree realization • improved support for Windows paths • better error messages & reporting • front-end tooling support • nerf peerDependencies • better CLI search
converting the CLI to an API • ػೳతཁ͕ࡍݶͳ͘ಧ͕͘ɺnpmطʹߴػೳ • APIͱͯ͠ఏڙͰ͖Εɺࣗ༝ʹΧελϚΠζՄೳ
• ͓·͚ʹɺnpmͷίʔυͷςετ͕͘͢͠ͳΔ • npm cache & npm-registry-clientͷ࠶ઃܭ • cache.jsͷίʔυɺnpmඇґଘɺmulti-registryαϙʔτ • ΦϑϥΠϯϞʔυͷ࣮Λ༰қʹ͢Δ
dependency tree realization • ਖ਼֬ͳΠϯετʔϧͷॱংΛอূ͢Δ 1. ΠϯετʔϧࡁΈͷpackageΛ֬ೝ 2. ϩʔΧϧͷnode_modulesͷޮతͳ࠷ऴΠϝʔδߏங 3.
࣮ࡍʹ࣮ߦ͠ͳ͖Ό͍͚ͳ͍ΞΫγϣϯͷϦετߏங 4. ΠϯετʔϧΛ࣮ߦ • npm i -g npm͕ࣦഊͨ͠ࡍʹ͕ࣗফ͑ΔࣄނΛ͙ • ؆୯ͦ͏ʹݟ͑ͯɺ࣮ࡍͷϓϩηεඇৗʹෳࡶ See also: https://docs.npmjs.com/cli/install#algorithm
improved support for Windows paths • front-endπʔϧͷීٴʹΑΓɺWindowsͰnpm͕α ϙʔτ͖͠Ε͍ͯͳ͍γʔϯ͕සൃ࢝͠Ίͨ • plugin-basedͳπʔϧͷଟ͘ɺඇৗʹ͍ϑΝΠϧ
ύεΛཁٻ͢ΔΑ͏ʹͳ͖ͬͯͨ • Windows Ͱɺ୯Ұύε࠷େ 260 จࣈ·Ͱ • npm dedupeͰnode_modulesͷFlatԽΛਪਐ͖ͯͨ͠ ͕ɺ͜ͷͷղܾͷͨΊʹେʹมߋ͕ඞཁ
better error messages & reporting • ࠷ॳͷࠒͷϢʔβʔͰ͋ΔServer side Node.js DeveloperɺෳࡶͳUnix
Error messageΛใࠂ • front-end toolΛ୲͏Α͏ʹͳ͖ͬͯͨͷͰɺͬͱ ͔Γ͍͢ΤϥʔΛදࣔͰ͖ΔΑ͏ʹվળ • 1000 issues͕OPENঢ়ଶʹ͋ΓɺreportίϚϯυͷ Α͏ͳܗͰΤϥʔใࠂͷ؆қԽɺ࠷దԽɺޮ্
front-end tooling support • npmͷར༻ྫͰɺ࠷͍ͯ͘͠Δͷ͏ͪͷҰͭ • ଟछଟ༷ͳϢʔεέʔεΛαϙʔτ͢ΔγϯϓϧͳαϒηοτΛ ௐࠪ͢Δ • Ember/Angular/BrowserifyͳͲͷ։ൃνʔϜͱٞ
• ۩ମతʹෳࡶͳ͕ൃੜ͍ͯ͠ΔΘ͚Ͱͳͦ͞͏ͰɺԿ͔ ͕͋Εղܾ͢Δͱ͍͏ํ • ecosystemͱ͍͏ɺpluginͷݕࡧΛ༰қʹ͢Δregistryଆͷ৽ػೳ ͳͲ͕༧ఆ͞Ε͍ͯΔ
nerf peerDependencies • require()͢Δpackagedependency • testίʔυͷதͰrequire͢Δpackage devDependency • peerDependenciesࠞཚͷݪҼʹ •
See also: https://github.com/npm/npm/issues/5080
better CLI search • ͍·ͷnpm searchɺ͏গ͠վળͷ༨͕͋Δ • npmjs.com Ͱվળ͕ྃͨ͠Βɺ CLIʹػೳΛ࣋ͬͯ͘Δ
• Ecosystem, CollectionsͳͲ
notes • npm install -g npm npm@3͕betaͳ͏ͪɺnpm@2ͷ࠷৽͕ೖΔ • npm install
-g npm@3 npm@3ͷ࠷৽͕ೖΔ • ҆ఆੑͱޙํޓͷͳ͍มߋΛίϛϡχςΟʹೝΊ ͯΒ͏·Ͱϕʔλͷ··
• peerDependencies • engineStrict • npm view breaking changes
peerDependencies • Πϯετʔϧ͞Εͳ͘ͳΔ • Πϯετʔϧ͞Ε͍ͯͳ͍ͱɺwarning͕ग़Δ
engineStrict • ͋·ΓΘΕ͍ͯͳ͔ͬͨ • ܯࠂͷදࣔͷΈͱͳͬͨ • npm config set engine-strict
trueͰɺengines field ΛݩʹengineStrictͷڍಈΛ࠶ݱՄೳ
npm view • Objectͷ͕1ͭͷͱ͖ɺArrayΛฦ͢Α͏ʹͳͬ ͨ • e.g. Before: versions: '0.0.1'
After: versions: [ '0.0.1' ]
• Flat, flat, flat! • The multi-stage installer • Install:
it works different! • Shrinkwraps: they are a-changin'! • The Age of Progress (Bars)! new features
Flat, flat, flat! • node_modulesҎԼ͕ɺՄೳͳݶΓflatʹͳͬͨ • node_modulesҎԼʹɺωετ͞Εͣʹinstall͞Ε Δ • ಉ໊͡લͷҧ͏versionͷdependencyʹґଘͨ͠
module͕͋Δͱ͖ɺͦΕͧΕͷmoduleͷԼʹωε τ͞Εͯinstall͞ΕΔ
The multi-stage installer • dependency tree realization • read =>
eval => apply => display • Detail: https://github.com/npm/npm/issues/ 5919#issuecomment-51858095
Install: it works different! • npm ls, npm outdatedʹӨڹ •
node_modules͕flatʹͳͬͨҰํͰɺtreeਖ਼֬ʹ ࢠؔΛදࣔ͢Δ
Shrinkwraps: they are a-changin'! • ॳճͷnpm-shrinkwrap.jsonແ͠ͷinstall ೋճͷnpm-shrinkwrap.json༗ΓͰinstall ͜ΕΒႈͰ͋Δ͖ • npm-shrinkwrap.json͕͋Δঢ়ଶͰpackage.jsonΛ
ߋ৽ͨ͠߹ɺө͞ΕΔ͖(kinda `—save` opt) • node_modules͕flatʹͳͬͨͷͰɺshrinkwrapʹ ө
The Age of Progress (Bars)! http://blog.npmjs.org/post/110290693555/npm-weekly-4
Flat, flat, flat! http://blog.npmjs.org/post/111968476155/npm-weekly-6
• npm ping • npm install —no-progress • npm team
• npm access • npm install —only=dev v3.1 - v3.3: Minor updates These features are from v2.13.0 and v2.14.0
npm ping SYNOPSIS npm ping [--registry <registry>]
npm ping • registry͕ਖ਼ৗ͔pingΛ࣮ߦͯ͘͠ΕΔ • API༻్ɺΦϑϥΠϯରԠͷੴͩͱࢥ͍·͢
npm team SYNOPSIS npm team create <scope:team> npm team destroy
<scope:team> npm team add <scope:team> <user> npm team rm <scope:team> <user> npm team ls <scope>|<scope:team> npm team edit <scope:team>
npm team • scoped packageΛɺGitHubͷΑ͏ʹorganizer୯Ґ ͰཧͰ͖ΔΑ͏ʹͳΔɻΒ͍͠ • Կ͔ࢼͨ͠ΜͰ͕͢·ͩಈ͍ͯͳ͍ͷͰௐࠪத
• http://blog.npmjs.org/post/122450408965/npm-weekly-20-npm-3-is-here-ish • http://blog.npmjs.org/post/91303926460/npm-cli-roadmap-a-periodic-update • http://blog.npmjs.org/post/94662089625/the-future-of-the-npm-website-lets-map-this • http://blog.npmjs.org/post/110290693555/npm-weekly-4 • http://blog.npmjs.org/post/111968476155/npm-weekly-6
• https://github.com/npm/npm/blob/master/CHANGELOG.md • https://github.com/npm/npm/issues/5919#issuecomment-51858095 • https://github.com/npm/npm/issues/5080 • https://twitter.com/othiym23 • http://www.infoq.com/news/2015/06/npm • https://github.com/npm/npm/releases/tag/v2.13.0 • https://github.com/npm/npm/releases/tag/v2.14.0 • http://windows.microsoft.com/ja-jp/windows/file-names-extensions-faq#1TC=windows-7 • https://github.com/npm/npm/search?q=enoent&ref=cmdform&type=Issues Reference links
Happy Hacking!