npm: node package manager, 翻译成中文就是node包管理工具。随着Node.js的火爆，应用npm共享js代码曾经成为每个前端开发者的必备工具。但就现状而言：一部分开发者还只是停留在npm install层面。更有甚者，一言不合就开删, rm -f node_modules。明天就让小编带你去理解npm的基本原理和实际。

1. npm init

初始化package.json文件，生成name，version，script等字段。具体阐明举荐npm的package.json中文文档

2. npm install

依赖治理是npm的核心内容。原理是执行npm install从package.json中装置依赖。

npm install \<package\>后，咱们能够在node_modules中查看装置的依赖包。尽管开发者只需关注业务中的援用依赖即可。

这是开发者最罕用的指令，clone我的项目或者新建必须的第一个指令。

3. npm --save-dev与npm --save

--save || -S： 运行依赖（公布）,将包信息增加到dependencies，是须要公布到生产环境的。

--save-dev || -D:开发依赖（辅助），将包信息增加到devDependencies，只用于开发环境

装置依赖时如何判断？ 官网说法是：--save-dev咱们只在开发时才用失去它，生产部署后则不执行。--save：咱们在开发实现后，必定还要依赖他们，否则就用不了。简略的说：就是如果没有该依赖则程序就跑不起来，则必须应用--save。如vue-router. 如果该依赖只是为了编译、构建、生成文档则应用--save-dev

4. package-lock.json

package-lock.json文件的作用是锁定装置时的包的版本号。

4.1 ^: 主版本号管制

^是npm默认的版本符号，举个例子

"requires": {  "graceful-fs": "^4.1.2",  "inherits": "~2.0.0",  "mkdirp": ">=0.5 0",  "rimraf": "2"}

这个符号定义了向后（新）兼容依赖，通知npm能够装置8.0.33或者一个大于它的版本，然而次要版本为4.x.x的版本

4.2 ~： 次版本号管制

~是次版本号管制，举个例子

"requires": {  "graceful-fs": "^4.1.2",  "inherits": "~2.0.0",  "mkdirp": ">=0.5 0",  "rimraf": "2"}

与^的区别是，～版本只能规定次版本号2.0.x，仅仅是作用域不同而已

4.3 >: beta版本

指定了能够装置的beta版本。能够了解为大于或等于。如： 0.5.1

因而，当咱们应用npm install会依据package-lock.json文件进行装置，保障不同环境、不同工夫下当依赖是一样的。而不是依据package.json文件。因为pacakge-lock.json给每个依赖都表明了版本、获取地址、哈希值，所以，每次装置都是同一个雷同的后果。不论你在什么机器下面或者什么时候装置。

基于此，咱们手动更改package.json文件装置将不会更新包，想要更新则必须指定版本号。如： npm install axious@3.2.0 --save-dev,这种形式来版本更新package-lock.json则能够。

谨记：不要手动批改package-lock.json

5. 依赖治理

  1. 不要手动批改package-lock.json文件
  2. 我的项目组成员首次checkout / clone 我的项目代码时，应手动npm install一下，确保同步依赖
  3. 小版本升级依赖，能够应用npm update
  4. npm uninstall <package> 删除依赖包
  5. 任何我的项目组成员在更新package.json, package-lock.json文件后，项目组其余成员应从新拉取，并应用npm install同步更新依赖

6. npm scripts

{ "scripts": {    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",    "start": "npm run dev",    "lint": "eslint --ext .js,.vue src",    "build": "node build/build.js"  }}

在vue我的项目中，npm run dev能够说是咱们最常见的命令了，兴许咱们素来都没有过这条脚本命令的原理。明天就让小编初窥一二。详情能够参考阮一峰的npm scripts 使用指南

上述代码是package.json文件的一个片段，外面的scripts字段是一个对象。它的每一个属性，对应一段脚本。比方npm run dev命令对应的脚本就是webpack-dev-server --inline --progress --config build/webpack.dev.conf.js。

npm的脚本原理非常简单，每当执行npm run，就会主动创立一个shell，比拟特地的是，npm新建的这个shell，会将node_modules/.bin子目录退出path变量，执行完结后，在将PATH复原原样。

这意味着，当前目录的node_modules/.bin子目录外面的所有脚本，都能够间接用脚本名调用，而不用加上门路。

7. npm装置失败解决办法

当clone或者初始化我的项目时，npm i报错时，不要心急，尝试以下4大步骤，定能搞定

1.先删除node_modules文件夹
rm -rf node_modules
2.清理npm缓存
npm cache clean --force
3.独自装置失败的npm（这是一步到位的方法。当然也可省略该步骤，间接跳到步骤4----不倡议省略）
npm i xx
4.装置残余的npm
npm i

留神：

  1. 请审慎手动删除package-lock.json文件，而后npm i操作，尽管该办法能解决绝大多数npm i装置失败问题，但会造成npm依赖树谬误，尤其是多人合作开发时，会呈现测试环境运行失常，打包上线后不能工作的问题
  2. 尽可能的不必cnpm，因为会漏掉很多依赖，会产生各种莫名其妙的问题

8. 参考文献

  1. npm: package.json
  2. 阮一峰的npm scripts 使用指南