npm 入門

Npm 是随同 Nodejs 一起安裝的 js 包管理工具。

關鍵詞：
nodejs , 包管理 npm cnpm

簡介

常見的使用場景有以下幾種：

允許使用者從 Npm 伺服器下載下傳别人編寫的第三方包到本地使用。
允許使用者從 Npm 伺服器下載下傳并安裝别人編寫的指令行程式到本地使用。
允許使用者将自己編寫的包或指令行程式上傳到 Npm 伺服器供别人使用。

如果一個項目中存在

package.json

檔案，那麼使用者可以直接使用

npm install

指令自動安裝和維護目前項目所需的所有子產品。在

package.json

檔案中，開發者可以指定每個依賴項的版本範圍，這樣既可以保證子產品自動更新，又不會因為所需子產品功能大幅變化導緻項目出現問題。開發者也可以選擇将子產品固定在某個版本之上。

安裝

由于新版的 nodejs 已經內建了 npm，是以之前 npm 也一并安裝好了。同樣可以通過輸入

npm -v

來測試是否成功安裝。指令如下，出現版本提示表示安裝成功:

$ npm -v
2.3.0

可以通過指令方式更新 npm

Linux - sudo npm install npm -g
Window - npm install npm -g

Npm 工作流

Npm 工作流：

建立一個新項目
增加／更新／删除依賴
安裝／重裝你的依賴
引入版本控制系統（例如 git）
持續內建

Npm 常用指令

每個指令都會更新

package.json

檔案。

Npm 提供了很多指令，例如 install 和 publish ，使用 npm help 可檢視所有指令。
使用 npm help 可檢視某條指令的詳細幫助，例如 npm help install 。
在 package.json 所在目錄下使用 npm install . -g 可先在本地安裝目前指令行程式，可用于釋出前的本地測試。
npm update 可以把目前目錄下 node_modules 子目錄裡邊的對應子產品更新至最新版本。
npm update -g 可以把全局安裝的對應指令行程式更新至最新版。
npm cache clear 可以清空 Npm 本地緩存，用于對付使用相同版本号釋出新版本代碼的人。
npm unpublish @ 可以撤銷釋出自己釋出過的某個版本代碼。

Npm 提供了很多指令，例如 install 和 publish，使用 npm help 可檢視所有指令。

初始化新項目

npm init 用于初始化項目，它會建立一個名為 package.json 的配置檔案。

指令格式

npm init [-f|--force|-y|--yes]

說明

執行指令後，npm 會問你一系列問題，然後在執行指令的目錄下建立一個

package.json

如果使用

-f

--force

或

-y

--yes

，npm 會使用預設值為你建立

package.json

檔案，不再詢問任何問題。

建立子產品，package.json 檔案是必不可少的。我們可以使用 Npm 生成

package.json

檔案，生成的檔案包含了基本的結果。

$ npm init
This utility will walk you through creating a `package.json` file.
It only covers the most common items, and tries to guess sensible defaults.

See `npm help json` for definitive documentation on these fields
and exactly what they do.

Use `npm install <pkg> --save` afterwards to install a package and
save it as a dependency in the `package.json` file.

Press ^C at any time to quit.
name: (node_modules) runoob                   # 子產品名
version: (1.0.0)
description: Node.js 測試子產品(www.runoob.com)  # 描述
entry point: (index.js)
test command: make test
git repository: https://github.com/runoob/runoob.git  # Github 位址
keywords:
author:
license: (ISC)
About to write to ……/node_modules/package.json:      # 生成位址

{
  "name": "runoob",
  "version": "1.0.0",
  "description": "Node.js 測試子產品(www.runoob.com)",
  ……
}


Is this ok? (yes) yes

以上的資訊，你需要根據你自己的情況輸入。在最後輸入 "yes" 後會生成

package.json

接下來我們可以使用以下指令在 npm 資源庫中注冊使用者（使用郵箱注冊）：

$ npm adduser
Username: mcmohd
Password:
Email: (this IS public) [email protected]

安裝子產品

npm install 用于安裝子產品。

npm install (with no args, in package dir)
npm install <tarball file>  # 安裝位于檔案系統上的包。
npm install <tarball url>   # 擷取 url，然後安裝它。為了區分此選項和其他選項，參數必須以“http://”或“https://”開頭。
npm install <folder>        # 安裝位于檔案系統上某檔案夾中的包
npm install [<@scope>/]<name>                 # 安裝指定的包的最新版本。
npm install [<@scope>/]<name>@<tag>           # 安裝被 tag 引用的包的版本。如果 tag 不存在于該包的系統資料庫資料中，則失敗。
npm install [<@scope>/]<name>@<version>       # 安裝指定的包的版本。如果版本尚未釋出到系統資料庫，則失敗。
npm install [<@scope>/]<name>@<version range> # 安裝與指定版本範圍相比對的包版本。

npm install [<@scope>/] [-S|--save|-D|--save-dev|-O|--save-optional]

參數說明：

npm install

有 3 個可選參數，用于儲存或更新主

package.json

中的包版本：

-S, --save - 包将被添加到 dependencies
-D, --save-dev devDependencies
-O, --save-optional optionalDependencies

當使用上述任何選項将依賴儲存到

package.json

時，有兩個額外的可選标志 -

-E, --save-exact - 會在 package.json 檔案指定安裝子產品的确切版本。
-B, --save-bundle - 包也将被添加到 bundleDependencies

全局安裝與本地安裝

npm 的包安裝分為本地安裝（local）、全局安裝（global）兩種，從敲的指令行來看，差别隻是有沒有-g 而已，比如

npm install express     # 本地安裝
npm install express -g  # 全局安裝

本地安裝

将安裝包放在 node_modules 下（運作 npm 指令時所在的目錄），如果沒有 node_modules 目錄，會在目前執行 npm 指令的目錄下建立 node_modules 目錄。
可以通過 require() 來引入本地安裝的包。

示例：我們使用 npm 指令安裝常用的 Node.js 的 web 架構子產品 express:

$ npm install express

安裝好之後，express 包就放在了工程目錄下的

node_modules

目錄中，是以在代碼中隻需要通過

require('express')

的方式就好，無需指定第三方包路徑。

var express = require('express');

全局安裝

将安裝包放在 /usr/local 下或者你 node 的安裝目錄。
可以直接在指令行裡使用。

如果你希望具備兩者功能，則需要在兩個地方安裝它或使用 npm link。

接下來我們使用全局方式安裝 express

$ npm install express -g

安裝過程輸出如下内容，第一行輸出了子產品的版本号及安裝位置。

[email protected] node_modules/express
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected])
└── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])

解除安裝子產品

npm uninstall 用于解除安裝包。

npm uninstall [<@scope>/]<pkg>[@<version>]... [-S|--save|-D|--save-dev|-O|--save-optional]

aliases: remove, rm, r, un, unlink

在全局模式下（即，在指令中附加

-g

--global

），它将目前包上下文作為全局包解除安裝。

npm uninstall

有 3 個可選參數，用于儲存或更新主 package.json 中的包版本：

-S, --save dependencies
-D, --save-dev devDependencies
-O, --save-optional optionalDependencies

例：

npm uninstall sax
npm uninstall sax --save
npm uninstall @myorg/privatepackage --save
npm uninstall node-tap --save-dev
npm uninstall dtrace-provider --save-optional

更新子產品

npm update 用于更新本地安裝的子產品。

npm update [-g] [<pkg>...]

aliases: up, upgrade

注：從 [email protected] 開始， npm update 僅更新頂級包。舊版本的 npm 會遞歸檢查所有的依賴。如果要達到舊版本的行為，請使用 npm --depth 9999 update

管理配置檔案

npm config 指令用于管理配置檔案。

npm config set <key> <value> [-g|--global]  # 設定一個配置參數
npm config get <key>                        # 擷取一個配置參數
npm config delete <key>                     # 删除一個配置參數
npm config list                             # 列印配置參數清單
npm config edit                             # 直接編輯配置檔案
npm get <key>                               # npm config get <key> 的簡寫。
npm set <key> <value> [-g|--global]         # npm config set <key> <value> [-g|--global] 的簡寫

釋出包

npm publish 用于釋出一個包。

npm publish [<tarball>|<folder>] [--tag <tag>] [--access <public|restricted>]

Publishes '.' if no argument supplied
Sets tag 'latest' if no --tag specified

說明：将包釋出到系統資料庫，以便可以按名稱安裝。如果沒有本地 .gitignore .npmignore 檔案，則包括軟體包目錄中的所有檔案。如果這兩個過濾檔案都存在時，某個檔案被 .gitignore 忽略，而不被 .npmignore 忽略，則它将被包括。

執行腳本

npm run 用于執行腳本。

如果在

package.json

檔案中的

scripts

字段定義了指令，就可以使用

npm run

來執行腳本指令。

示例：

假設

package.json

scripts

字段如下定義：

"scripts": {
    "test": "mocha",
    "lint": "eslint lib bin hot scripts",
    "prepublish": "npm run test && npm run lint",
    "start": "node index.js"
}

npm run test - 相當于執行 mocha 指令。它會開始執行測試架構 Mocha 。
npm run lint eslint lib bin hot scripts 指令。它會開始執行 eslint 檢查。
npm run prepublish npm run test npm run lint 兩條指令。現在你了解如何複合指令了吧。
npm start node index.js 。Node.js 啟動一個服務的入口腳本。

檢視安裝資訊

你可以使用以下指令來檢視所有全局安裝的子產品：

$ npm list -g

├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├─┬ [email protected]
│ │ └── [email protected]
│ ├─┬ [email protected]
│ │ └── [email protected]
……

如果要檢視某個子產品的版本号，可以使用指令如下：

$ npm list grunt

projectName@projectVersion /path/to/project/folder
└── [email protected]

配置檔案

使用 npm 來管理的 javascript 項目一般都有一個

package.json

檔案。它定義了這個項目所依賴的各種包，以及項目的配置資訊（比如名稱、版本、依賴等中繼資料）。

package.json

中的内容就是 json 形式。

重要字段：

name - 包名。
version - 包的版本号。
description - 包的描述。
homepage - 包的官網 url 。
author - 包的作者姓名。
contributors - 包的其他貢獻者姓名。
dependencies - 指定項目運作所依賴的子產品。
devDependencies - 指定項目開發所依賴的子產品。
repository - 包代碼存放的地方的類型，可以是 git 或 svn，git 可在 Github 上。
main - main 字段是一個子產品 ID，它是一個指向你程式的主要項目。就是說，如果你包的名字叫 express，然後使用者安裝它，然後 require("express")。
keywords - 關鍵字
bin - 用來指定各個内部指令對應的可執行檔案的位置。
scripts - 指定了運作腳本指令的 npm 指令行縮寫。

示例：一個完整的 package.json

{
  "name": "reactnotes",
  "version": "1.0.0",
  "description": "react 教程",
  "main": "./index.js",
  "dependencies": {
    "react": "^15.4.1",
    "react-dom": "^15.4.1"
  },
  "devDependencies": {
    "webpack-dev-server": "^1.16.2"
  },
  "scripts": {
    "start": "node index.js"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/atlantis1024/ReactNotes.git"
  },
  "author": "victor",
  "license": "Apache-2.0",
  "bugs": {
    "url": "https://github.com/atlantis1024/ReactNotes/issues"
  },
  "homepage": "https://github.com/atlantis1024/ReactNotes#readme"
}

package 版本

上文介紹 package.json 檔案中的

dependencies

devDependencies

字段，這二者都是 json 數組。它們的每個 json 子對象，key 表示包名，value 表示版本。

npm 允許的版本聲明方式十分多樣。下面将為你介紹一二。

version - 安裝一個确定的版本，遵循“大版本.次要版本.小版本”的格式規定。如：1.0.0。
~version - 以 ~1.0.0 來舉例，表示安裝 1.0.x 的最新版本（不低于 1.0.0）。但是大版本号和次要版本号不能變。
^version ^1.0.0 來舉例，表示安裝 1.x.x 的最新版本（不低于 1.0.0），但是大版本号不能變。
1.2.x - 表示安裝 1.2.x。
>、>=、<、<= - 可以像數組比較一樣，使用比較符來限定版本範圍。
version1 - version2 - 相當于 >=version1 <=version2 .
range1 || range2 - 版本滿足 range1 或 range2 兩個限定條件中任意一個即可。
tag - 一個指定 tag 對應的版本。
* "" (空字元串)：任意版本。
latest - 最新版本。
http://... file://... - 你可以指定 http 或本地檔案路徑下的包作為版本。
git... - 參考下面的“直接将 Git Url 作為依賴包版本”
user/repo

例：下面的版本聲明都是有效的

{
  "dependencies": {
    "foo": "1.0.0 - 2.9999.9999",
    "bar": ">=1.0.2 <2.1.2",
    "baz": ">1.0.2 <=2.3.4",
    "boo": "2.0.1",
    "qux": "<1.0.0 || >=2.3.1 <2.4.5 || >=2.5.2 <3.0.0",
    "asd": "http://asdf.com/asdf.tar.gz",
    "til": "~1.2",
    "elf": "~1.2.3",
    "two": "2.x",
    "thr": "3.3.x",
    "lat": "latest",
    "dyl": "file:../dyl"
  }
}

直接将 Git Url 作為依賴包版本

Git Url 形式可以如下：

git://github.com/user/project.git#commit-ish
git+ssh://user@hostname:project.git#commit-ish
git+ssh://user@hostname/project.git#commit-ish
git+http://user@hostname/project/blah.git#commit-ish
git+https://user@hostname/project/blah.git#commit-ish

版本号

使用 Npm 下載下傳和釋出代碼時都會接觸到版本号。Npm 使用語義版本号來管理代碼，這裡簡單介紹一下。

語義版本号分為 X.Y.Z 三位，分别代表主版本号、次版本号和更新檔版本号。當代碼變更時，版本号按以下原則更新。

如果隻是修複 bug，需要更新 Z 位。
如果是新增了功能，但是向下相容，需要更新 Y 位。
如果有大變動，向下不相容，需要更新 X 位。

版本号有了這個保證後，在申明第三方包依賴時，除了可依賴于一個固定版本号外，還可依賴于某個範圍的版本号。例如"argv": "0.0.x"表示依賴于 0.0.x 系列的最新版 argv。

Npm 支援的所有版本号範圍指定方式可以檢視官方文檔。

npm 擴充

cnpm

大家都知道國内直接使用 npm 的官方鏡像是非常慢的，這裡推薦使用淘寶 NPM 鏡像。

淘寶 NPM 鏡像是一個完整 npmjs.org 鏡像，你可以用此代替官方版本(隻讀)，同步頻率目前為 10 分鐘一次以保證盡量與官方服務同步。

你可以使用淘寶定制的 cnpm (gzip 壓縮支援) 指令行工具代替預設的 npm:

$ npm install -g cnpm --registry=https://registry.npm.taobao.org

這樣就可以使用 cnpm 指令來安裝子產品了：

$ cnpm install [name]

更多資訊可以查閱：http://npm.taobao.org/。

nrm

Nrm 是 NPM 注冊伺服器管理工具，可以快速切換不同的系統資料庫：npm，cnpm，nj，taobao，或者是你自己的私服。

安裝 nrm

npm install -g nrm

檢視可用伺服器

# 檢視可用伺服器
$ nrm ls

* npm -----  https://registry.npmjs.org/
  cnpm ----  http://r.cnpmjs.org/
  taobao --  https://registry.npm.taobao.org/
  nj ------  https://registry.nodejitsu.com/
  rednpm -- http://registry.mirror.cqupt.edu.cn
  skimdb -- https://skimdb.npmjs.com/registry

# 切換伺服器
$ nrm use tabao

nrm 指令語義

Usage: nrm [options] [command]

  Commands:

    ls                           List all the registries
    use <registry>               Change registry to registry
    add <registry> <url> [home]  Add one custom registry
    del <registry>               Delete one custom registry
    home <registry> [browser]    Open the homepage of registry with optional browser
    test [registry]              Show the response time for one or all registries
    help                         Print this help

  Options:

    -h, --help     output usage information
    -V, --version  output the version number

引用和引申

👉 歡迎閱讀我的前端技術教程系列：frontend-tutorial

Npm 官網
Npm 中文網
Npm Github
淘寶 NPM 鏡像 - 代替官方版本，加速下載下傳
awesome-npm - npm 資源
sinopia - 零配置搭建 npm 私服
nrm - npm 伺服器位址管理工具
NPM 使用介紹