NPM 简介、安装、配置、常用方法

NPM简介

npm，全名 node package manger（node 包管理器）。

官网：​​https://www.npmjs.com​​

文档：​​​​https://docs.npmjs.com​​

npm中文：​​https://www.npmrc.cn/​​

npm 是 Node 的开放式模块登记和管理系统，是 Node.js 包的标准发布平台，用于 Node.js 包的发布、传播、依赖控制。

npm 提供了命令行工具(CLI)，可以方便地下载、安装、升级、删除包，也可以作为开发者发布并维护包。

安装

npm 随 node.js 的安装一同安装，安装完 node.js 后，npm 自动可用。

Node.js 官网： ​​https://nodejs.org/zh-cn/​​

npm 默认的安装路径：​​%APPDATA%\npm\​​；

比如，我本地 ​​C:\Users\用户名\AppData\Roaming\npm​​

用户名，改成你的就可以了；

镜像

淘宝镜像站：​​https://developer.aliyun.com/mirror/​​

淘宝NPM镜像：之前的镜像域名已经换成新的了，目前最新地址如下；

http://npmmirror.com
http://registry.npmmirror.com

npm官方地址：http://registry.npmjs.org 

修改成淘宝镜像地址：国内更快；

> npm config set registry http://registry.npmmirror.com

查看当前npm平台地址：

> npm config get registry
"http://registry.npmmirror.com"

也可以直接找到  ​​C:\Users\用户名\.npmrc​​ 这个文件修改（不推荐）：

registry=http://registry.npmmirror.com/

升级

npm 是随 Node.js 安装的，若想升级到最新版本：

> npm install npm@latest -g

但一般 node.js 各版本有与其匹配的 npm 版本，所以，要升级就一起升吧；

​​查看 node.js 和 npm 版本匹配​​

基本命令

npm -h

获取帮助信息；

查看npm命令列表，列表常用命令的使用；

跟在集合后面用来显示相关命令的帮助信息；

-h 的别名：help 

> npm -h 
或
> npm help

但看 config 的用法：

> npm config -h

上面，刚使用过  npm config get registry 来查看镜像的地址；

还可以显示更全面的信息：

> npm help config

会打开本地安装的关于 config 的文档；

npm -v

显示当前 npm 版本信息

> npm -v

刚才使用升级命令，升级到最版本了；

npm ls

列出当前项目目录安装的包

> npm ls
或
> npm list

上面显示了，当前目录中安装的 ​​babel​​​ 和 ​​@vue/cli​​ 脚手架的包

查看 ls 帮助信息

> npm ls -h

还有很多参数，比如加上 ​​-g​​，会显示所有全局的包，不加就只会显示当前目录的包；

> npm ls -g

npm -l

查看 npm 各命令基本用法

# 查看各个命令的简单用法
> npm -l   

# 或加个 more ，可以一屏一屏浏览
> npm -l | more

npm 的很多命令，​​config​​ 是常用的一个；

知道几个常用的命令就可以，不明白地方可以查看帮助和列表命令的参数；

---

创建项目

一个项目的初建，都需要一个 package.json ,用来配置一些信息：包括项目作者、项目描述、项目依赖哪些包、插件配置信息；

npm init 

初始化项目分三步：

第一步：新建项目文件夹，在命令提示符窗口，进入这个文件夹；

比如，我新建了一个项目文件夹叫：vue_t2，在命令提示符窗口进入：

第二步：使用 npm ini 指令创建项目描述文件 package.json

命令行会以交互形式问一些项目信息，依次配置：

name : 项目名称

version：项目的片本号

description ：项目的描述信息

entry point ：项目入口文件

test command：项目启动时脚本命令

git repository ：如果你有 git 地址，可以将这个项目放到你的 Git 仓库

keywords：关键词

author：作者

license：项目要发行的时候需要的证书；

不知怎么填的就回车跳过；

最后，会问你，是不是OK？ 回车就是OK。

初始化给创建了这个 package.json 文件，打开看看就是刚才填的信息；

第三步：刚才填了个入口文件 ​​entry point​​ ，我指定的是 main.js，那就在这个 main.js 里写点代码：

console.log('a test project!')

保存文件，回到命令提示符：

package.json 文件详解

先看下这个一般项目的 package.json 配置文件：

{
  "private": true,
  "dependencies": {
    "antd": "^2.11.1",
    "classnames": "^2.2.5"
  },
  "devDependencies": {
    "axios": "^0.15.3",
    "babel-eslint": "^6.1.2"
  },
  "scripts": {
    "start": "node index.js"
  }
}

private 属性

可选选项，布尔值。 如果​​ private​​​ 为​​ true​​ ，那么 npm 会拒绝发布；

这可以防止私有 ​​repositories​​ 不小心被发布出去；

dependencies 和 devDependencies

dependencies : 指定项目生产环境时所依赖的模块；

devDependencies：指定项目开发环境时所依赖的模块；

开发环境：前端开发工程化的发展，各种工具、插件等使开发环境变得庞大；

生产环境：是项目上线后直接接触用户的产品环境，性能最优的形态；

项目在开发阶段，需要对模块单元测试，会在开发环境 ​​devDependencies​​​ 下安装测试模块，但在生产环境 ​​dependencies​​ ，用户直接使用项目，就不需要测试模块了，加上只会影响性能；

所以：开发环境不能直接应用为生产环境；

scripts 属性

scripts 脚本运行方式是在命令行输入 ： npm run <脚本名称>

上例中只有一个 start ，那么运行时输入 ： npm run start

如果不输入脚本，就需要在命令行中输入  ​​node index.js​​ 

全局安装和本地安装

使用 ​​-g​​ 安装的模式为全局安装，不使用则为本地安装；

> npm install express -g

不使用 ​​-g​​ 安装，就是本地安装

> npm install path

先看一下全局安装和本地安装，都把模块安装到哪里去了？

> npm ls -g

这个命令，在上面基本命令中讲过；

全局安装的模块，都默认安装在 :

c:\Users\用户名\AppData\Roaming\npm

这么一个目录下的，也是 npm 的默认安装目录；

其实在 npm 安装目录下，还有一个 node_modules 的目录，所有全局安装的模块都默认安装在这个目录里。 

当然这个目录也是可以配置的，免得都安装到 C盘，占用系统盘空间；

> npm ls

这样不加 ​​-g​​ 的命令，就是查看本地安装的模块；

但凡使用本地安装的模块，都会存放在当前目录下的 node_modules 目录中；以我们的项目为例，当前项目路径是 ： 

D:\Pro_Temp\vue_t2>

全局安装和本地安装的模块有什么区别？

全局安装的包只需要安装一次，以后在计算机任何位置都可以使用这个包；

本地安装的包只能用在当前目录的项目中，换到其他目录就不能用了；

总结：全局安装的包，安装一次重复使用；本地安装的包，使用什么就安装什么；

哪些包应该放在全局，哪些包又该放在本地？

约定俗成的：对于提供命令行工具的包进行全局安装，其他包本地安装；

比如：安装 ​​eslint​​ 包

> npm install eslint -g

使用指令  ​​--init​​ 设置一个配置文件

像这种能提供指令的包通常进行全局安装；

不确定哪个包是不是有指令的话，就先安装在本地，在以后实践中发现这个包提供指令，还可以卸载包，重新安装到全局。

模块版本说明

不论发布还是下载模块，都会涉及到模块版本的问题：

版本号

版本几乎都遵循  x.y.z 的规则，发布的第一个版本一般为 1.0.0

z 补丁号。修改某个 bug 时，z++  如：1.0.1

y 小版本号。增加一个新功能，且不影响已有功能，y++ 如：1.1.0

x 大版本号。引入新的变化，破坏向兼容，x++ 如2.0.0

向哪兼容

向后兼容：win10 要能运行 为win7 开发的程序；

破坏向后兼容：新版本系统不能运行老版本上的程序，win10用不了win7的程序；

向前兼容：win7 要能运行为 win10 开发的程序；

package.json 中包版本 ~ 和 ^说明

package.json 中记录很多包（也叫模块）版本号，大多出现 ~ ^ 等版本号取值范围，只要包的版本号在这个范围内都是可以的；

假定某个包的版本是：1.4.0

~ 1.4.0 表示：小版本不变，补丁号可以取最大值；即 1.4 不变，后面补丁版本可以取最大的版本号；

^ 1.4.0 表示：大版本号不变，小版本号可以取最大值；即 1 不变，后面小版本可以取最大的版本号；

安装模块

本地安装：<package name> 你得先知道你要安装的包名叫什么

> npm install <package name>

全局安装

> npm install <package name> -g
或
> npm install <package name> -global

也可以先看一下 install 命令都有哪些参数：

> npm install -h

这个 install 有很多安装参数和别名，例举些常用的：

> npm install

按 package.json 中配置的包逐个安装到本地 node_modules 目录中。

> npm install <package name> -force

强制重新安装

> npm install vue@2.*

安装 vue 的 2.X 版本； 2 代表大版本号， * 可取小版本号中的最新版本；

目前vue有2X和3X，这里的意思是取 vue2.7 （2X版本中最新版本）；

不指定版本，会安装模块的最新版本；

> npm install antd babel-plugin-import

同时安装 antd 和 babel-plugin-import 两个模块；

> npm install antd --save
> npm install antd --save-dev

--save 是参数，将安装的模块信息记录在  package.json 文件中的 dependencies 属性中；

--sae-dev 也是参数，会将安装的模块信息记录在 package.json 文件中的 devDependencies 属性中；

卸载模块

如果要升级或降级某个版本，最好先卸载已经安装的版本，再安装；

npm uninstall 命令，卸载已安装的模块。

> npm uninstall [package name]

卸载本地安装的模块；

> npm uninstall [package name] -global
或
> npm uninstall [package name] -g

卸载全局已经安装的模块

> npm uninstall [package name] --save

卸载模块同时，删除在 package.json 中的记录

> npm uninstall lodash@3.*

卸载指定版本的模块

常用命令

npm config

> npm config get 
如
> npm config get registry

可以查看  npm 的 config 配置；

> registry=http://registry.npmmirror.com/

可以通过 set 设置 config 的镜像等；

npm info

显示某个模块的具体信息

> npm info vue

查看 vue 模块的信息：

npm list

以树型结构列出当前项目或全局安装的所有模块，以及依赖的模块；

> npm list vue -g

查看全局安装的 vue 的模块或依赖： 

显示 vue 版本 2.7.14 , @vue/cli 脚手架模块的版本是 5.0.8

更多使用，随时查看官网或中文文档