搬砖必会 - npm scripts 使用指南 - 《web前端》

————————————————————————————————————————————————

一、什么是 npm 脚本？

npm 允许在 package.json 文件里面，使用 scripts 字段定义脚本命令。

{
  // ...
  "scripts": {
    "build": "node build.js"
  }
}

上面代码是 package.json 文件的一个片段，里面的 scripts 字段是一个对象。它的每一个属性，对应一段脚本。比如， build 命令对应的脚本是 node build.js 。

命令行下使用 npm run 命令，就可以执行这段脚本。

$ npm run build
# 等同于执行
$ node build.js

这些定义在package.json里面的脚本，就称为 npm 脚本。它的优点很多。

查看当前项目的所有 npm 脚本命令，可以使用不带任何参数的npm run命令。

$ npm run

npm 脚本的原理非常简单。每当执行npm run，就会自动新建一个 Shell，在这个 Shell 里面执行指定的脚本命令。因此，只要是 Shell（一般是 Bash）可以运行的命令，就可以写在 npm 脚本里面。

比较特别的是，npm run新建的这个 Shell，会将当前目录的node_modules/.bin子目录加入PATH变量，执行结束后，再将PATH变量恢复原样。

这意味着，当前目录的node_modules/.bin子目录里面的所有脚本，都可以直接用脚本名调用，而不必加上路径。比如，当前项目的依赖里面有 Mocha，只要直接写mocha test就可以了。

"test": "mocha test"

而不用写成下面这样。

"test": "./node_modules/.bin/mocha test"

由于 npm 脚本的唯一要求就是可以在 Shell 执行，因此它不一定是 Node 脚本，任何可执行文件都可以写在里面。
npm 脚本的退出码，也遵守 Shell 脚本规则。如果退出码不是0，npm 就认为这个脚本执行失败。

由于 npm 脚本就是 Shell 脚本，因为可以使用 Shell 通配符。

"lint": "jshint *.js"
"lint": "jshint **/*.js"

上面代码中，表示任意文件名，*表示任意一层子目录。
如果要将通配符传入原始命令，防止被 Shell 转义，要将星号转义。

"test": "tap test/\*.js"

四个常用的 npm 脚本有简写形式。

npm start、npm stop和npm restart都比较好理解，而npm restart是一个复合命令，实际上会执行三个脚本命令：stop、restart、start。具体的执行顺序如下。

// 本地搭建一个 HTTP 服务 “serve”: “http-server -p 9090 dist/“,

// 打开浏览器 “open:dev”: “opener http://localhost:9090“,

// 实时刷新 “livereload”: “live-reload —port 9091 dist/“,

// 构建 HTML 文件 “build:html”: “jade index.jade > dist/index.html”,

// 只要 CSS 文件有变动，就重新执行构建 “watch:css”: “watch ‘npm run build:css’ assets/styles/“,

// 只要 HTML 文件有变动，就重新执行构建 “watch:html”: “watch ‘npm run build:html’ assets/html”,

// 部署到 Amazon S3 “deploy:prod”: “s3-cli sync ./dist/ s3://example-com/prod-site/“,

// 构建 favicon “build:favicon”: “node scripts/favicon.js”, ```