转载:package.json

282 阅读3分钟

原文链接:juejin.cn/post/684490…

scripts


npm 允许在package.json文件里面,使用scripts字段定义脚本命令。 优点: 项目的相关脚本,可以集中在一个地方。
不同项目的脚本命令,只要功能相同,就可以有同样的对外接口。用户不需要知道怎么测试你的项目,只要运行npm run test即可。

可以利用 npm 提供的很多辅助功能。

npm 脚本的原理非常简单。每当执行npm run,就会自动新建一个 Shell,在这个 Shell 里面执行指定的脚本命令。因此,只要是 Shell(一般是 Bash)可以运行的命令,就可以写在 npm 脚本里面。 比较特别的是,npm run新建的这个 Shell,会将当前目录的node_modules/.bin子目录加入PATH变量,执行结束后,再将PATH变量恢复原样。 这意味着,当前目录的node_modules/.bin子目录里面的所有脚本,都可以直接用脚本名调用,而不必加上路径。比如,当前项目的依赖里面有 Mocha,只要直接写mocha test就可以了。

*通配符

*表示任意文件名,**表示任意一层子目录。


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

如果要将通配符传入原始命令,防止被 Shell 转义,要将星号转义。

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

脚本传参符号: --

"server": "webpack-dev-server --mode=development --open --iframe=true ",

脚本执行顺序

并行执行(即同时的平行执行),可以使用&符号

$ npm run script1.js & npm run script2.js

复制代码继发执行(即只有前一个任务成功,才执行下一个任务),可以使用&&符号

$ npm run script1.js && npm run script2.js

复制代码脚本钩子 npm 脚本有pre和post两个钩子, 可以在这两个钩子里面,完成一些准备工作和清理工作 eg:

"clean": "rimraf ./dist && mkdir dist",
"prebuild": "npm run clean",
"build": "cross-env NODE_ENV=production webpack"

复制代码npm 默认提供下面这些钩子:

prepublish,postpublish
preinstall,postinstall
preuninstall,postuninstall
preversion,postversion
pretest,posttest
prestop,poststop
prestart,poststart
prerestart,postrestart

拿到package.json的变量

npm 脚本有一个非常强大的功能,就是可以使用 npm 的内部变量。 首先,通过npm_package_前缀,npm 脚本可以拿到package.json里面的字段。比如,下面是一个package.json。

// package.json
{
  "name": "foo", 
  "version": "1.2.5",
  "scripts": {
    "view": "node view.js"
  }
}

复制代码我们可以在自己的js中这样:

console.log(process.env.npm_package_name); // foo
console.log(process.env.npm_package_version); // 1.2.5

复制代码常用脚本

// 删除目录
"clean": "rimraf dist/*",

// 本地搭建一个 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",

复制代码介绍几个在npm脚本中好用的模块

cpx全局复制

一个很好用的模块, 可以监视全局文件变化, 并将其复制到我们想要的目录 我们使用npm安装就可以在npm的脚本中使用了:

"copy": "cpx \".conf.json\" \"config/\" "

复制代码这样我们运行npm run copy就可以将根目录下的.conf.json文件拷贝到config文件夹下了, 如果没有config文件夹就会新建一个。

cpx "src/**/*.{html,png,jpg}" app --watch

复制代码当src目录下的任意.html, .png, .jpg等文件发生变化就拷贝到app目录下。 cross-env能跨平台地设置及使用环境变量
大多数情况下,在windows平台下使用类似于: NODE_ENV=production的命令行指令会卡住,windows平台与POSIX在使用命令行时有许多区别(例如在POSIX,使用$ENV_VAR,在windows,使用%ENV_VAR%。。。)
cross-env让这一切变得简单,不同平台使用唯一指令,无需担心跨平台问题:

"start": "cross-env NODE_ENV=production node server/index.js",