關於NPM你必需要知道的經常使用命令

npm:全稱node package mananger，是世界上最大規模的包管理系統，官網是這樣介紹的 Build amazing things...

那我們就來看看他作了哪些驚人的事~

一.npm init

默認你們確定比較熟悉了，直接 npm init -y了事，這回咱們再來仔細看看

{
  "name": "webyouxuan",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {},
  "license": "ISC"
}

這裏先聲明npm的版本是6.7.0，由於個人node版本是v11.14.0

我們來逐個說說這裏比較重要的字段:name、version、main、scripts、license

• name是當前包的名字，也就是最終發佈在npm官網上包的名字。不能和已有的包重名哦！
• version就是當前包的版本號，主要咱們要探究若是優雅的管理版本號。
• main就是當前包的入口文件，也就是使用require默認引入的文件。
• scripts能夠配置一些執行腳本。
• license是協議許可。

二.npm install

1.全局安裝

npm install http-server -g

全局安裝的意思很簡單，就是安裝的模塊會被安裝到全局下，能夠在命令行中直接使用安裝的包,其實只是在/user/local/bin目錄下做了個連接，鏈接到 /usr/local/lib/node_modules/http-server/bin/http-server了這個文件，當咱們執行http-server這個命令時，就會調用連接的這個文件。

mac由於有權限問題，這裏咱們加 sudo來執行命令

咱們能夠本身來嘗試寫一個包，建立bin目錄，新增www文件,名字叫什麼無所謂啦~

#! /usr/bin/env node
console.log('關注webyouxuan哈'); // #! 這句表示採用node來執行此文件，同理shell能夠表示sh

更新package.json文件

"bin": {
    "youxuan":"./bin/www"   // 這裏要注意名字和你創建的文件夾要相同
},

好了，寫好啦！這裏咱們先不說發包的事，用一個經常使用的命令，他能夠實現連接的功能：

npm link

[圖片上傳失敗...(image-a09819-1567445632022)]

這樣咱們在命令行中直接輸入youxuan就能夠打印出關注webyouxuan！

2.本地安裝

npm install webpack --save-dev

本地安裝很好理解，就是所謂的在項目中使用，而非在命令行中使用！這裏咱們看到生成了一個package-lock.json文件，並且將安裝的模塊放到了node_modules下，而json中也新增了些內容

"devDependencies": {
    "webpack": "^4.39.3"
}

這裏咱們先來簡單介紹下基本的使用

--save-dev表明當前依賴只在開發時被應用，若是默認不寫則至關於 --save，是項目依賴開發上線都須要的

也能夠指定版本號來安裝包

npm i jquery@2.2.0 # install能夠簡寫成i

默認執行npm i會安裝項目中全部須要的依賴，若是隻想安裝生產環境的依賴能夠增長--production參數

三.package-lock文件

自npm 5以後全部的依賴包都採用扁平化管理的方式
package-lock.json 的做用是鎖定依賴安裝結構，保證在任意機器上執行 npm install 都會獲得徹底相同的 node_modules 結果，由於package-lock.json存儲了全部安裝的信息。

"name": "youxuan",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"@webassemblyjs/ast": { 
    "version": "1.8.5", // 當前依賴的版本
    "resolved": "https://registry.npm.taobao.org/@webassemblyjs/ast/download/@webassemblyjs/ast-1.8.5.tgz", // 從哪一個渠道安裝的
    "integrity": "sha1-UbHF/mV2o0lTv0slPfnw1JDZ41k=", // 內容hash
    "dev": true,
    "requires": {
    "@webassemblyjs/helper-module-context": "1.8.5",
    "@webassemblyjs/helper-wasm-bytecode": "1.8.5",
    "@webassemblyjs/wast-parser": "1.8.5"
    }
},
....

若是手動更新了package.json文件，執行安裝命令會下載對應的新版本,而且會自動更新lock文件~

四.依賴方式

簡單介紹下常見的依賴方式：

1.dependencies 項目依賴

可使用npm install -S或 npm install --save保存到依賴中，當發佈到npm上時dependencies下的模塊會做爲依賴，一塊兒被下載!

2.devDependencies 開發依賴

可使用npm install -D或 npm install --save-dev保存到依賴中。
當發佈到npm上時devDependencies下面的模塊就不會自動下載了，若是隻是單純的開發項目dependencies，devDependencies只有提示的做用！

3.peerDependencies 同版本依賴

同等依賴，若是你安裝我，那麼你最好也安裝我對應的依賴，若是未安裝會報出警告

"peerDependencies": {
    "jquery": "2.2.0"
}

npm WARN youxuan@1.0.0 requires a peer of jquery@2.2.0 but none is installed. You must install peer dependencies yourself.

4.bundledDependencies 捆綁依賴

"bundleDependencies": [
    "jquery"
 ],

使用npm pack 打包tgz時會將捆綁依賴一同打包。

5.optionalDependencies 可選依賴

若是發現沒法安裝或沒法找到，則不會影響npm的安裝。

五.npm版本管理

npm採用了semver規範做爲依賴版本管理方案。semver 約定一個包的版本號必須包含3個數字

MAJOR.MINOR.PATCH 意思是 主版本號.小版本號.修訂版本號

• MAJOR 對應大的版本號迭代，作了不兼容舊版的修改時要更新 MAJOR 版本號
• MINOR 對應小版本迭代，發生兼容舊版API的修改或功能更新時，更新MINOR版本號
• PATCH 對應修訂版本號，通常針對修復 BUG 的版本號

當咱們每次發佈包的時候都須要升級版本號

npm version major  # 大版本號加 1，其他版本號歸 0
npm version minor  # 小版本號加 1，修訂號歸 0
npm version patch  # 修訂號加 1

若是使用git管理項目會自動 git tag 標註版本號

來看看版本號的標識含義:

range	含義	例
^2.2.1	指定的 MAJOR 版本號下, 全部更新的版本	匹配 2.2.3, 2.3.0; 不匹配 1.0.3, 3.0.1
~2.2.1	指定 MAJOR.MINOR 版本號下，全部更新的版本	匹配 2.2.3, 2.2.9 ; 不匹配 2.3.0, 2.4.5
>=2.1	版本號大於或等於 2.1.0	匹配 2.1.2, 3.1
<=2.2	版本號小於或等於 2.2	匹配 1.0.0, 2.2.1, 2.2.11
1.0.0 - 2.0.0	版本號從 1.0.0 (含) 到 2.0.0 (含)	匹配 1.0.0, 1.3.4, 2.0.0

預發版：

• alpha(α)：預覽版，或者叫內部測試版；通常不向外部發布，會有不少bug；通常只有測試人員使用。
• beta(β)：測試版，或者叫公開測試版；這個階段的版本會一直加入新的功能；在alpha版以後推出。
• rc(release candidate)：最終測試版本；可能成爲最終產品的候選版本，若是未出現問題則可發佈成爲正式版本。

2.1.0-beta.1這樣聲明的版本用戶不會立馬使用，能夠用來作測試使用。

六.scripts配置

在package.json中能夠定義本身的腳本經過npm run來執行

"scripts": {
   "hello": "echo webyouxuan",
   "build": "webpack"
}

咱們可使用 npm run hello執行腳本，也可使用 npm run build執行node_modules/.bin目錄下的webpack文件

• npm run 命令執行時，會把 ./node_modules/.bin/ 目錄添加到執行環境的 PATH 變量中，所以若是某個命令行包未全局安裝，而只安裝在了當前項目的 node_modules的，經過 npm run 同樣能夠調用該命令。
• 執行 npm 腳本時要傳入參數，須要在命令後加 -- 標明， 如 npm run hello -- --port 3000 能夠將 --port 參數傳給 hello 命令

• npm 提供了 pre 和 post 兩種鉤子機制，能夠定義某個腳本先後的執行腳本，沒有定義默認會忽略

  "scripts": {
     "prehello":"echo 關注",
     "hello": "echo webyouxuan",
     "posthello":"echo 謝謝~"
  }

能夠經過打印 全局env和在項目下執行 npm run env來對比 PATH屬性，不難發如今執行npm run 的時候確實會將 ./node_modules/.bin/ 目錄添加到 PATH中

七.協議

不廢話，這張圖就說明了爲何MIT許但是最大的了!

八.npx用法

npx命令是npm v5.2以後引入的新命令，npx能夠幫咱們直接執行node_modules/.bin文件夾下的文件

1.執行腳本

npx webpack

是否是省略了配置scripts腳本啦！

2.避免安裝全局模塊

全局安裝的模塊會帶來不少問題，例如：多個用戶全局安裝的模塊版本不一樣

npx create-react-app react-project

咱們能夠直接使用 npx 來執行模塊，它會先進行安裝，安裝執行後會將下載過的模塊刪除，這樣能夠一直使用最新版本啦!

九.包的發佈

包的發佈比較簡單，首先咱們須要切換到官方源,這裏推薦個好用的工具nrm

npm install nrm -g
nrm use npm # 切換到官方源

以後更新名字，這裏也能夠發佈 做用域包 選定版本後，忽略文件夾可使用 .npmignore，一切就緒後，發佈！！！

npm publish

ok，咱們的包就能夠成功的發佈到npm上啦！

十. 更多資料

參考

• 2018 年了，你仍是隻會 npm install 嗎？
• npm官網
• 如何選擇開源許可證？

---