npm使用入門(package.json)

本文轉載自查看原文 2017-10-25 15:52 3457

npm使用入門

crazygit 關注

2017.03.10 18:31 字數 1773 閱讀 1617評論 0喜歡 10

NPM是什么

npm

npm makes it easy for JavaScript developers to share and reuse code, and it makes it easy to update the code that you're sharing.

簡單來說，npm就是javascript的包管理工具，類似java語法當中的maven, gradle, python的pip。

安裝

npm是和Node.js一起發布的，只要安裝了Node.js，npm也安裝好了，可以從Node.js的下載頁下載對應操作系統的安裝包安裝即可。安裝好后，執行如下命令，檢查是否安裝成功。

$ node -v
v6.10.0

$ npm -v
4.4.1

但是由於npm自身的更新頻率比Node.js高很多，所以通過上面的命令安裝的npm可能不是最新版本，可以通過下面的命令單獨更新npm

$ npm install npm@latest -g

安裝包

執行命令

$ npm install <package_name>

便可以安裝對應的包到執行命令的當前目錄，並創建一個node_modules的文件夾,然后把需要安裝的安裝包下載到里面。

使用`package.json`

通過上面的命令，直接安裝的包默認都是最新版本的。但是在項目中，我們怎么讓一起開發的同事知道項目中用了哪些包，具體包的版本信息呢？這時package.json就上場了，可以把它想成是java語言中的pom.xml,
python語言中的requirements.txt。

一個基本的package.json文件至少需要包含兩個重要信息: 包名name和版本信息version。
例如:

{
  "name": "my-awesome-package",
  "version": "1.0.0"
}

創建`package.json`

我們可以使用命令npm init來初始化一個package.json文件，運行這個命令后，它會詢問一些關於包的基本信息，根據實際情況回答即可。如果不喜歡這種方式，可以使用npm init --yes命令直接使用默認的配置來創建package.json文件，最后根據需要修改創建好的package.json文件即可。

package.json文件創建好后，我們來看看它長得什么樣子吧！

{
  "name": "my_package",
  "description": "",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/ashleygwilliams/my_package.git"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/ashleygwilliams/my_package/issues"
  },
  "homepage": "https://github.com/ashleygwilliams/my_package"
}

主要字段的含義如下:

name: 模塊名, 模塊的名稱有如下要求:
- 全部小寫
- 只能是一個詞語，沒有空格
- 允許使用破折號和下划線作為單詞分隔符
version: 模塊版本信息
description：關於模塊功能的簡單描述，如果這個字段為空的話，默認會從當前目錄的READMD.md或README文件讀取第一行內容作為它的默認值。
main: 模塊被引入后，首先加載的文件，默認為index.js。
scripts: 定義一些常用命令入口

類似git一樣，npm也可以做一些簡單的配置來設置一些我們常用的信息

$ npm set init.author.email "wombat@npmjs.com"

$ npm set init.author.name "ag_dubs"

$ npm set init.license "MIT"

這樣下次執行npm init的時候，就會用上我們配置的一些默認信息啦！

安裝模塊

使用npm install會讀取package.json文件來安裝模塊。安裝的模塊分為兩類
dependencies和devDependencies，分別對應生產環境需要的安裝包和開發環境需要的安裝包。

同樣在安裝模塊的時候，可以通過指定參數來修改package.json文件，如

$ npm install <package_name> --save

$ npm install <package_name> --save-dev

來將新安裝的模塊信息記錄到package.json文件。

更新模塊

$ npm update

卸載模塊

$ npm uninstall <package_name>

如果要在卸載模塊的同時，也將他從package.json文件中移除，可以添加跟安裝時候一樣的參數，例如:

$ npm uninstall --save lodash

全局包管理

默認情況下。我們執行默認的安裝命令安裝的包都是安裝到當前目錄下的，只能在當前目錄下使用。但是假如我們需要使用一些全局的軟件，如grunt，我們可以在安裝的時候，添加-g選項來安裝，方便后面在任何目錄下都可以使用grunt相關的命令

$ npm install -g grunt

同理，更新全局的安裝包只需要執行命令

$ npm update -g

為了查看當前哪些包需要更新，可以使用如下命令來查看

$ npm outdated -g --depth=0
Package             Current  Wanted  Latest  Location
vue-cli               2.7.0   2.8.1   2.8.1
webpack              1.13.2   2.2.1   2.2.1
webpack-dev-server   1.14.1   2.4.1   2.4.1

卸載全局安裝的包也只需要加上-g選項即可。如

$ npm uninstall -g jshint

創建自己的Node.js模塊

一個Node.js模塊就是一個可以發布到npm，供其他開發者下載和使用的模塊。那么，到底怎樣和其他開發者分享我們的模塊呢？

首先，我們必須創建一個package.json文件，添加上關於我們想要分享的模塊信息，如：模塊功能，開發者信息等。

一旦package.json文件創建好后，我們需要創建一個模塊被引入時，就加載的文件。
即package.json中main字段指定的文件，默認為index.js。我們需要在文件中將一個函數賦值給exports模塊，方便其他開發者調用我們的模塊。如

exports.printMsg = function() {
  console.log("This is a message from the demo package");
}

包(Pacakges)和模塊(Modules)

在使用npm的時候，有兩個概念容易搞混，那就是包(Pacakges)和模塊(Modules)。簡單來說，包和模塊的區別如下：

包是一個被package.json文件描述了的文件或者目錄
模塊是可以被Node.js引用的文件或目錄

什么是包？

a) a folder containing a program described by a package.json file
b) a gzipped tarball containing (a)
c) a url that resolves to (b)
d) a <name>@<version> that is published on the registry with (c)
e) a <name>@<tag> that points to (d)
f) a <name> that has a latest tag satisfying (e)
g) a git url that, when cloned, results in (a).

什么是模塊？

A folder with a package.json file containing a main field.

A folder with an index.js file in it.

A JavaScript file.

npm配置

在使用npm時，我們可以根據個人的需要，指定很多配置信息。
npm的配置信息加載優先級如下(從高到低)

命令行參數
環境變量
npmrc文件
1. 項目級別的npmrc文件(/path/to/my/project/.npmrc)
2. 用戶級別的npmrc文件（~/.npmrc）
3. 全局的npmrc文件($PREFIX/etc/npmrc)
4. npm內置的npmrc文件(/path/to/npm/npmrc)

查看配置

$ npm config list -l

配置npm源

最后介紹一個比較重要的配置，當我們使用默認配置從npm官網下載模塊時，由於網絡的因素，會導致我們的下載速度特別慢。所以，我們可以配置一些國內的鏡像來加快我們的下載速度。在這里，我推薦使用淘寶的npm鏡像, 具體使用方式如下:

臨時使用, 安裝包的時候通過--registry參數即可

  $ npm install express --registry https://registry.npm.taobao.org

全局使用

  $ npm config set registry https://registry.npm.taobao.org
  // 配置后可通過下面方式來驗證是否成功
  npm config get registry
  // 或
  npm info express

使用cnpm使用

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

  // 使用cnpm安裝包
  cnpm install express