现实需求：使用vue-cli等脚手架工具创建工程后，当工程中的模块有更新时，如何将工程中的模块都更新到最新？

检查模块更新

使用 npm 管理工具的检查更新命令能列举出当前工程所有可更新的 node_module：

1
npm outdated //检查 module 更新

使用后效果如下所示（只截取了部分数据）：

1
2
3
4
5
6
7
Package                             Current   Wanted  Latest  Location
autoprefixer                          7.2.6    7.2.6   9.1.3  navigation
babel-eslint                          8.2.6    8.2.6   9.0.0  navigation
babel-jest                           21.2.0   21.2.0  23.4.2  navigation
chromedriver                         2.40.0   2.41.0  2.41.0  navigation
iview                                2.14.3   2.14.3   3.0.1  navigation
vue                                  2.5.16   2.5.17  2.5.17  navigation

图片效果如下所示：

输出结果展示了包的类别或名称（Package）、当前包版本（Current）、满足 package.json 中指定 semver 范围的包的最大版本（Wanted）、最新包版本（Latest）以及包所在依赖关系树中的位置（Location），关于该命令的详细解释参见 npm-outdated。

单个模块更新

获取到包最新的版本号，可以通过命令

1
npm install module@version // module 为模块名，version 为版本号

来更新单个模块

更新所有模块

更为现实的要求是更新所有模块，然而命令

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

只能根据 package.json 中的版本指定进行更新，即它会将 Current 版本更新到 Wanted 版本。如果不指定包名，他将更新所有包（全局/本地取决于参数 -g）并且从npm@2.6.1开始，该命令只会检查顶级软件包。具体效果如下图，与之前相比，Current 与 Wanted 已经保持一致（红色部分没有了）。关于该命令更多详情参见 npm-update。

npm-update

因此，要想使用这种方法更新所有包，需要手动更改 package.json 文件（或使用程序自动化），比较麻烦。

更高效的办法是使用插件：npm-check-updates

安装方法：

1
npm install -g npm-check-updates // 使用全局安装，因为不仅限于某个工程使用

检查更新：

1
npm-check-updates // 列出所有可更新的包

或者使用缩写：

1
ncu

效果如下（只截取了部分数据）：

1
2
3
4
5
6
7
8
9
10
11
12
Using E:\Repos\navigation\package.json
[..................] \ :
 iview                               ^2.14.3  →   ^3.0.1
 autoprefixer                         ^7.1.2  →   ^9.1.3
 babel-eslint                         ^8.2.1  →   ^9.0.0
 babel-jest                          ^21.0.2  →  ^23.4.2
 babel-loader                         ^7.1.1  →   ^8.0.0
 babel-plugin-dynamic-import-node     ^1.2.0  →   ^2.1.0
 cross-spawn                          ^5.0.1  →   ^6.0.5
 css-loader                          ^0.28.0  →   ^1.0.0
 eslint                              ^4.15.0  →   ^5.5.0
 eslint-config-standard              ^10.2.1  →  ^12.0.0

上述命令后添加参数选项：

1
-a, --upgradeAll

即可完成所有报的更新。

使用参数选项：

1
-u, --upgrade

将更新 package.json 文件。

写在最后

为确保相关包已更新，可以再次使用 npm outdated 命令进行检查。

因为 package.json 文件已更新，则可以使用 npm update 命令更新相关包。此处建议仅供参考，可能会出现奇奇怪怪问题，譬如工程无法运行。

更多使用详情，参看 npm-check-updates。