npm 的全名是 Node Package Manager,就是一個很大的「套件倉庫」
在開發時,有時候會想要找一些別人已經寫好的 open source 功能來使用,就可以透過 npm 來安裝這些套件、library
在裝 node.js 的時候,預設就會直接把 npm 一起安裝好
輸入指令 npm -v
,如果有出現版本號,就代表有成功安裝 npm
npm 可以做什麼?
library 跟 module 跟 package 其實都是差不多的東西
- 透過 npm 來管理這些「我下載下來的套件」
- 也可以使用 npm 來把我寫好的套件上傳上去,讓全世界的人使用:
我寫好了一個 module(一個功能),就可以把它包裝成一個 package(套件),然後上傳到 npm 上面,其他人就可以把這個 package 下載下來使用
npm install:以 left-pad 為例
其實 left-pad 這個 module 發生過一些很有名的事情,因為很多有名的 library 都有用到 left-pad,之前作者把這個 module 從 npm 上面拿掉,造成了其他使用它的 module 都沒辦法安裝,詳情可參考:如何看待 Azer Koçulu 刪除了自己的所有 npm 庫? 或是 抽掉 11 行程式就讓網路大崩塌!一場撞名事件,看開源的威力與權力衝突。
如何從 npm 找到一個套件,並裝在我的資料夾底下
假設,我想在我的專案資料夾中,使用 pad-left 這個套件
- 在專案資料夾,先輸入指令
npm init
來產生 package.json 檔案
package.json 這個檔案是用來「描述我這個專案」的
json 格式跟物件差不多,只是 json 的 key 一定要用「雙引號」包起來:
"main"
是「入口檔案」的意思"dependencies"
是「依賴」的意思:我有裝了哪些套件
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"pad-left": "^2.1.0"
}
}
- 輸入指令
npm install pad-left
或是npm i pad-left
都可以
(i
就是install
的簡寫而已)
補充資訊:
從 npm 5 以後,
--save
就已經是預設的選項了,所以npm install pad-left
不加--save
也是可以的,一樣會把 dependencies 的資訊寫到 package.json 裡面去
這時,專案資料夾裡面就多了兩個東西:
- package-lock.json 檔案
- node_modules 資料夾
npm 會把所有抓下來的 package 都放在 node_modules 資料夾裡面
用 var padLeft = require('pad-left')
來引入 module
這裡的 module 名稱只需要寫 'pad-left' 就可以了
原因是:
require 很智慧,會去各個地方找 pad-left 這個 module
- 如果 module 名稱前面有加上
./
,就代表要在「同一個資料夾底下找」 - 如果 module 名稱前面沒有加上
./
,那就會先去「系統(Node.js)內找」,如果系統沒有提供 pad-left 這個 module,那就會去 node_modules 資料夾找
因此,就可以在 node_modules 資料夾找到 pad-left 這個 module 了
var padLeft = require('pad-left')
console.log(padLeft(789, 10, '0'))
// output: 0000000789
npm scripts
在 package.json 裡面,有一個區塊是 "scripts"
:
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
在 "scripts"
可以先寫好一些指令,當我用 npm 執行 test
指令時,就會幫我執行 echo \"Error: no test specified\" && exit 1
這行指令
例如:
當我要執行一個檔案時,我就會輸入指令 node index.js
但是當專案變大時,可能會有很多個 js 檔案(index1.js, index2.js, home.js, main.js 等等)
每個 js 檔案看起來都很像入口點(很像是我應該要執行的檔案),我不知道是要執行哪一個,這時該怎麼辦?
方法一:
在 package.json 的 "main"
先寫好「入口檔案」
"main": "index.js",
方法二:
在 "scripts"
寫上這行 "start": "node index.js"
意思就是:
當我執行 start
指令時,npm 就會幫我執行 node index.js
這個指令
start
就像是一個「別名」
"scripts": {
"start": "node index.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
所以,我就可以輸入指令 npm run start
意思就是:我要用 npm 來執行 start
這個指令
就會幫我執行 node index.js
yarn:npm 以外的另一種選擇
yarn 是由 Facebook 開發的,可以把它想成是一個更新、更快速的 npm,因此,通常比較新的專案都會使用 yarn
安裝好 yarn 之後,使用指令 yarn -v
就可以看到版本(就代表我有安裝成功)
接著,要如何使用 yarn 呢?
用 yarn 安裝 dependencies 的套件
假設,我現在從 GitHub 上面 clone 下來一個專案(裡面不會有 node_modules,只會有 package.json 檔案)
第一步:我就必須先執行指令 yarn
或是 yarn install
(就等同於 npm install
的作用),yarn 就會把 package.json 的 dependencies 有寫到的所有套件(node_modules)給安裝進來
用 yarn 安裝新的套件
在 npm 要安裝新的套件,要使用指令 npm install pad-left
如果是用 yarn 安裝新的套件,就要使用指令 yarn add pad-left
,同時也會把 pad-left 套件寫進 package.json 的 dependencies 裡面
用 yarn 執行 scripts
用 npm 執行 scripts
,是使用指令 npm run start
如果是用 yarn 執行 scripts
的話:
使用指令 yarn run start
就可以執行 package.json 裡面 scripts
的 start
指令,也就是 node index.js
"scripts": {
"start": "node index.js",
"test": "echo \"Error: no test specified\" && exit 1"
},