[譯]npm入門指南

github 博客地址： https://github.com/zengxiaota...

這篇文章是我在 衆成翻譯 翻譯的一篇文章，一篇 npm 的入門指南，原文連接

Node.js 的出現使得用 Javascript 寫服務端應用成爲可能。Node.js 由 C++ 編寫而成而且構建於 V8 引擎之上，所以運行得很快。一開始，Node.js 只是想運行於服務端環境，可是開發者們顯然不知足於此，開始創造各類工具來實現自動化任務。也由於此，基於 Node 的前端自動化工具（如Grunt, Gulp 和 Webpack)的出現也給前端開發帶來了翻天覆地的變化。

本文最後更新時間爲 08.06.2017, 介紹了包括了 npm 當前現狀，以及 npm5 的一些改變。

想要利用這些工具或者模塊包，咱們須要使用合理的方式來安裝和管理這些模塊，這也是 npm 這個包管理工具出現的初衷。咱們經過 npm 來安裝模塊而且使用其提供的接口來使用這些模塊。

在本文中，我將要介紹 npm 的基本用法，告訴大家怎麼安裝安裝本地和全局模塊包，怎麼刪除，升級和安裝一個特定版本的模塊。同時我還會介紹怎麼利用 package.json 文件來管理你的依賴。若是你喜歡觀看視頻，也能夠註冊成爲 SitePoint Premium 的會員，觀看咱們的免費視頻： What is npm and How Can I Use It?。

在咱們開始使用 npm 以前，咱們必須先在本地系統中安裝 Node.js。讓咱們開始吧。

安裝 Node.js

做者的更多文章

• Redux vs MobX: Which Is Best for Your Project?

• 10 jQuery HTML5 Audio Players

首先前往 Node.js 的下載頁面獲取你須要的版本。下載頁面提供了 Windows 和 Mac 的安裝包以及預編譯的 Linux 二進制源代碼，對於 Linux 用戶，你還能夠經過包管理工具來安裝。

寫這篇教程時，Node.js 的 LTS 版本爲 v6.10.3,所以本文也會以此版原本講解。

提示：你可能想經過版本管理工具來安裝 Node.js，咱們將會在後面的章節介紹。

安裝以後讓咱們來看看 node 的安裝位置以及安裝的版本。

$ which node
/usr/bin/node
$ node --version
v6.10.3

爲了驗證咱們已經正確安裝，進入 Node 的 REPL 試一下。

$ node
> console.log('Node is running');
Node is running
> .help
.break Sometimes you get stuck, this gets you out
.clear Alias for .break
.exit  Exit the repl
.help  Show repl options
.load  Load JS from a file into the REPL session
.save  Save all evaluated commands in this REPL session to a file
> .exit

至此 Node.js 已經安裝完成，讓咱們來看看 npm, 它已經隨着 Node.js 一塊兒安裝在了你的系統中。

$ which npm
/usr/bin/npm
$ npm --version
3.10.10

Node模塊

npm 能夠以全局或者本地模式安裝模塊。本地模式下，全部的模塊包安裝在你當前工做目錄下的 node_modules 文件夾中，能被當前用戶訪問到。全局模式則是將模塊安裝在 {prefix}/lib/node_modules/ 中，爲 root 用戶全部({prefix} 一般是 /usr/ 或者 /usr/local])。這意味着當你想全局安裝模塊的時候，出於安全性的考慮和避免解析第三方的依賴模塊時能夠引起的權限錯誤，你須要使用 sudo 命令。

Time to manage those packages

更改全局模塊的安裝位置

輸入 npm config 命令，看看會輸出什麼。

$ npm config list
; cli configs
user-agent = "npm/3.10.10 node/v6.10.3 linux x64"

; userconfig /home/sitepoint/.npmrc
prefix = "/home/sitepoint/.node_modules_global"

; node bin location = /usr/bin/nodejs
; cwd = /home/sitepoint
; HOME = /home/sitepoint
; "npm config ls -l" to show all defaults.

npm config 命令提供了咱們的安裝的信息。如今，讓咱們獲取它們的安裝位置。

$ npm config get prefix
/usr

This is the prefix we want to change, so as to install global packages in our home directory. To do that create a new directory in your home folder.

$ cd ~ && mkdir .node_modules_global
$ npm config set prefix=$HOME/.node_modules_global

爲了在咱們的 home 目錄安裝全局模塊，咱們要更改的 prefix 就是這個，咱們首先在 home 目錄中建立一個新文件夾。

$ npm config get prefix
/home/sitepoint/.node_modules_global
$ cat .npmrc
prefix=/home/sitepoint/.node_modules_global

咱們仍然在 root 用戶目錄下安裝了 npm, 可是因爲咱們該改變了全局模塊的安裝位置，咱們須要再一次安裝 npm,這一次咱們會安裝最新版本的 npm5到新用戶目錄。

$ npm install npm --global
└─┬ npm@5.0.2
  ├── abbrev@1.1.0
  ├── ansi-regex@2.1.1
....
├── wrappy@1.0.2
└── write-file-atomic@2.1.0

最後咱們須要添加 .node_modules_global/bin 至 $PATH 環境變量。這樣咱們就能夠在命令行運行這些全局模塊。在 .profile，.bash_profile 或者 .bashrc 文件中添加下面這一行，並重啓你的終端。

`export PATH="$HOME/.node_modules_global/bin:$PATH"`

如今，命令行會首先發現 .node_modules_global/bin 目錄，而且會使用正確的 npm 版本。

$ which npm
/home/sitepoint/.node_modules_global/bin/npm
$ npm --version
5.0.2

安裝全局模塊

到目前爲止咱們只安裝了 npm 這一個全局模塊。如今再安裝 UglifyJS (一個 JavaScript 壓縮工具)。使用 --flag 標記，固然也能夠簡寫成 -g。

$ npm install uglify-js --global
/home/sitepoint/.node_modules_global/bin/uglifyjs -> /home/sitepoint/.node_modules_global/lib/node_modules/uglify-js/bin/uglifyjs
+ uglify-js@3.0.15
added 4 packages in 5.836s

你能夠看到，這個過程也安裝了其餘的模塊，它們都是 Uglify 的所依賴的模塊。

列出全部全局模塊

經過 npm list 能夠列出全部已經安裝的全局模塊。

$ npm list --global
home/sitepoint/.node_modules_global/lib
├─┬ npm@5.0.2
│ ├── abbrev@1.1.0
│ ├── ansi-regex@2.1.1
│ ├── ansicolors@0.3.2
│ ├── ansistyles@0.1.3
....................
└─┬ uglify-js@3.0.15
  ├─┬ commander@2.9.0
  │ └── graceful-readlink@1.0.1
  └── source-map@0.5.6

可是，獲得的輸出信息會很冗長，咱們能夠加上 --depth=0 來精簡一下輸出。

$ npm list -g --depth=0
/home/sitepoint/.node_modules_global/lib
├── npm@5.0.2
└── uglify-js@3.0.15

輸出信息如今更清楚了。咱們只列出了咱們安裝的模塊和版本號。

全部全局安裝的模塊均可以經過命令行訪問到。舉個例子，如今你想要使用 Uglify 模塊來壓縮 example.js 文件，輸出文件爲 example.min.js：

`$ uglifyjs example.js -o example.min.js`

本地模式下安裝模塊

當你想在本地安裝一個模塊，你首先須要一個 package.json 文件，因此讓咱們先建立一個。

$ npm init
package name: (project)
version: (1.0.0)
description: Demo of package.json
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC)

按下 Enter 它將會使用默認值，最後輸入 yes 來確認。這將會在你工程下的根目錄下建立一個 package.json 文件。

{
  "name": "project",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

小技巧：使用 npm init --y 能更快的建立 package.json文件。

package.json 的除了 main 和 scripts,每一項的意思的都很明確，具備 「自解釋性」。main 這一項表示你的程序的入口文件，scripts 表示你項目生命週期裏定義的可運行的腳本命令。到此，package.json 文件的這些項已經足夠，若是你想了解更多關於每一項的含義，你能夠看看 npm 的文檔 和這篇文章 using npm as a build tool.

如今，咱們來安裝 Underscore。

$ npm install underscore
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN project@1.0.0 No description
npm WARN project@1.0.0 No repository field.

+ underscore@1.8.3
added 1 package in 0.344s

注意到，安裝過程當中建立了一個 lockfile 文件，咱們以後會介紹它。

如今，再看一看 package.json 文件，咱們看到它多了 dependencies 這一項。

{
  ...
  "dependencies": {
    "underscore": "^1.8.3"
  }
}

使用 package.json 文件來管理依賴包

正如你所見，你的工程項目已經安裝了 1.8.3 版本的 Undescore。版本號前面的 ^ 符號表示當你安裝此模塊的時候，npm 會拉取它能發現的關於此模塊的最新版本，可是必須匹配主版本號（若是本地沒有 package-lock.json 文件）。在本例中，npm 會尋找低於 2.0.0 版本的最新版的 Underscore。這種模塊版本安裝方法叫作 語義化版本。你能夠閱讀這篇文章 Semantic Versioning: Why You Should Be Using it 來了解更多。

一樣要注意到，Underscore 被保存到了 dependencies 這一項了。在最新版本的 npm 也就是 npm5 中，這已經成爲了默認選項，表示程序運行時的必需模塊。你也能夠指定 --save-dev 選項來把模塊信息添加到 devDependencies 這一項，表示開發時所需的模塊，好比說測試或者代碼轉換。

你也在 package.json 文件中添加 private: true 這一項，防止你的私人倉庫被誤發佈，同時運行 npm install 命令時，避免產生任何警告信息。

到目前爲止，最應該使用 package.json 的理由是 package.json 指定了全部的依賴項，因此當咱們想克隆別人的代碼，咱們只須要複製 package.json 文件到項目的根目錄並運行 npm i，npm 將會自動分析文件而且安裝全部咱們所需的模塊。咱們在後面還會詳細講解。

在結束這一部分以前，咱們來檢查一下 underscore 是否正常工做。咱們在根目錄建立一個 test.js 文件，而且將以下代碼添加到代碼中。

const _ = require('underscore');
console.log(_.range(5));

在控制檯輸入 node test.js 來運行這個文件，屏幕上會輸出 [0, 1, 2, 3, 4]。

卸載本地模塊

npm 是一個包管理工具，因此必須具備移除模塊的功能。假設咱們如今安裝的 underscore 版本會引發一個兼容性問題，咱們能夠先移除它，並安裝以前穩定的版本。

$ npm uninstall underscore
removed 2 packages in 0.107s
$ npm list
project@1.0.0 /home/sitepoint/project
└── (empty)

安裝一個指定版本號的模塊

咱們如今能夠安裝任意想要的版本的 underscore, 只須要在 @ 符號後面加上所需版本號便可。

$ npm install underscore@1.8.2
+ underscore@1.8.2
added 1 package in 1.574s

$ npm list
project@1.0.0 /home/sitepoint/project
└── underscore@1.8.2

更新一個模塊

讓咱們檢查一下 underscore 是否有更新

$ npm outdated
Package     Current  Wanted  Latest  Location
underscore    1.8.2   1.8.3   1.8.3  project

Current 這一列告訴咱們咱們本地安裝的 underscore 版本，Latest 這一列則告訴咱們當前的 underscore 的最新版本，Wanted 這一列則表示在不破壞當前代碼的前提下，咱們能夠升級的最新版本。

記得咱們以前所說的 package-lock.json 文件嗎？ npm5 開始引入這個文件，目的是記住安裝的依賴包的版本號，從而使每臺機器上安裝的依賴包的版本都相同。每當你修改了 node_modules 文件夾或者 package.json 文件，package-lock.json 文件將會自動生成。

你能夠嘗試一個這個特性。刪除 node_modules 文件夾，從新運行 npm i 。新版本的 npm5 將會安裝 v1.8.2 版本的 Underscore。(由於在 package-lock.json 指定了 Underscore 的版本爲 1.8.2)。而舊版本的 npm 會安裝 1.8.3 版本的 Underscore。以前的經驗證實，版本不一致的依賴模塊將會給開發者帶來很大的麻煩，在以前，你須要手動建立一個 npm-shrinkwrap.json 文件來避免這個問題。

如今，假設 Underscore 的最新版本已經修復了咱們以前遇到的 bug, 咱們如今要更新 Underscore 至最新版本。

$ npm update underscore
+ underscore@1.8.3
updated 1 package in 0.236s

$ npm list
project@1.0.0 /home/sitepoint/project
└── underscore@1.8.3

提示: 爲了上述操做能生效，Underscore 必須位於 package.json 的 dependency 中。另外，若是你也不少過期的模塊，能夠執行 npm update 命令一塊兒更新全部模塊。

搜索一個模塊

你能夠看到，這篇教程你咱們已經屢次使用了 mkdir 命令，那麼是否有一個模塊能夠實現和 mkdir 同樣的功能，咱們有 npm search 試試看。

$ npm search mkdir
NAME      | DESCRIPTION          | AUTHOR          | DATE       | VERSION
mkdir     | Directory crea…      | =joehewitt      | 2012-04-17 | 0.0.2
fs-extra  | fs-extra conta…      | =jprichardson…  | 2017-05-04 | 3.0.1
mkdirp    | Recursively mkdir,…  | =substack       | 2015-05-14 | 0.5.1
...

咱們找到了(mkdirp)。安裝它。

$ npm install mkdirp
+ mkdirp@0.5.1
added 2 packages in 3.357s

如今咱們建立一個 mkdir.js 文件，而且將如下代碼複製進去。

const mkdirp = require('mkdirp');
mkdirp('foo', function (err) {
  if (err) console.error(err)
  else console.log('Directory created!')
});

在命令行中運行這個文件

$ node mkdir.js
Directory created!

從新安裝全部的依賴模塊

首先咱們安裝多個模塊。

$ npm install request
+ request@2.81.0
added 54 packages in 15.92s

檢查一下 package.json 文件

"dependencies": {
  "mkdirp": "^0.5.1",
  "request": "^2.81.0",
  "underscore": "^1.8.2"
},

注意到，dependencies 列表也自動更新了。在以前的 npm 版本，只有執行 npm install request --save 命令纔會將 dependency 保存到 package.json 文件中。若是你不想在 package.json 中保存，只須要使用 --no-save 參數。

假設你把你的工程文件拷貝到了另一臺機器上，而且咱們想安裝這些依賴。讓咱們先刪除 node_modules 文件夾，而後執行 npm install 命令。

$ rm -R node-modules
$ npm list
project@1.0.0 /home/sitepoint/project
├── UNMET DEPENDENCY mkdirp@^0.5.1
├── UNMET DEPENDENCY request@^2.81.0
└── UNMET DEPENDENCY underscore@^1.8.2

npm ERR! missing: mkdirp@^0.5.1, required by project@1.0.0
npm ERR! missing: request@^2.81.0, required by project@1.0.0
npm ERR! missing: underscore@^1.8.2, required by project@1.0.0

$ npm install
added 57 packages in 1.595s

檢查一下你的 node_modules 文件夾，你會發現全部的模塊都已經從新安裝了。經過這種方式，你能夠很簡單的與其餘人分享你的工程文件，你只需給他們一個 package.json 文件，而不用把你的全部依賴模塊給他們。

管理緩存

當你經過 npm 安裝一個模塊時，它會保存一份模塊的副本，因此當你下次安裝一樣的模塊的時候，npm 它不會訪問網絡，而是直接從你當前工做目錄的 .npm 文件夾下讀取緩存。

$ ls ~/.npm
anonymous-cli-metrics.json  _cacache  _locks  npm  registry.npmjs.org

可是隨着時間的推移，你的 .npm 文件夾會有不少夾雜許多舊的模塊包，這時就頗有必要按期清理一下你的 .npm 目錄了。

`$ npm cache clean`

若是你的想清除你係統內有多個 node 工程，你也在你的工做目錄下使用如下命令刪除全部的 node_modules 文件夾。

`find . -name "node_modules" -type d -exec rm -rf '{}' +`

別名

你可能注意到了，這裏有不少方式去執行咱們的 npm 命令。這裏有一個簡單的 npm 別名的列表

• npm i – install local package 本地安裝模塊

• npm i -g – install global package 全局安裝模塊

• npm un – uninstall local package 卸載本地模塊

• npm up – npm update packages 更新本地模塊

• npm t – run tests 運行測試

• npm ls – list installed modules 列出已安裝的模塊

• npm ll or npm la – print additional package information while listing modules 打印出所列模塊的附加信息

你也能夠像這樣一次安裝多個模塊

`$ npm i express momemt lodash mongoose body-parser webpack`

若是你想了解全部的 npm 命令，只須要運行 npm help 命令，或者你也能夠讀一讀咱們的這篇文章: 10 Tips and Tricks That Will Make You an npm Ninja.

版本管理工具

有不少的 Node.js 版本工具可供使用來管理你係統內的 Node.js 版本。好比說 n,或者nvm (Node Version Manager). 若是你對他們感興趣，你應該讀一下我這篇入門指南: Install Multiple Versions of Node.js using nvm.

結論

在這篇教程中，我介紹了 npm 的基本用法，包括如何安裝 Node.js、如何改變全局模塊的安裝位置(這樣咱們能夠避免使用 sudo)、若是本地或者去全局安裝 npm 模塊、同時還介紹了怎麼刪除，升級模塊，怎麼安裝一個指定版本的模塊以及怎麼管理你工程的各個依賴項。若是你想了解關於更多的 npm 最新版本的特性，你能夠訪問 npm 的 官方倉庫。

npm5 給全世界前端開發帶來了巨大的改進。其 COO 說，npm 的用戶羣在不斷變化，大部分用戶不只僅爲了寫 Node 程序而使用 npm, npm 已經成爲了前端整合 JavaScript 代碼的工具，甚至是現代 JavaScript 不可或缺的一部分。若是你尚未在你的項目中使用 npm ,如今是時候了。

這篇文章由Graham Cox審覈。感謝 SitePoint 上的審覈人員，是大家讓 SitePoint 的內容變得更好。