在拿到一个我的项目之后,如何看入口文件,如何运行我的项目,咱们都会找到 package.json 中的 script 。
甚至在做我的项目做久之后,咱们会本人写一些脚本来给开发提效,但你晓得 NPM 脚本能做什么吗? 你晓得如何传递一个参数给脚本? 你晓得如何执行某个脚本文件么?
在这篇文章中,我将分享我如何充分利用 NPM 脚本。
介绍
NPM 脚本是 package.json 中定义的一组内置脚本和自定义脚本。他们的指标是提供一种简略的办法来执行反复的工作,比方:
- 启动我的项目
- 打包我的项目
- 执行单元测试,生成测试报告之类
- ……
那如何定义一个NPM脚本?须要做的就是设置它的名称,并在 package.json 文件的 script 属性中编写该脚本, 如下:
"scripts": { "test": "echo \"Error: no test specified\" && exit 1"}
值得注意的是,NPM 中所有依赖的 node_modules bin 都能够在脚本中间接拜访,就像在门路中被援用的一样。比方:
{ "scripts": { "lint": "./node_modules/.bin/eslint .", }}// 此写法与下面成果雷同{ "scripts": { "lint": "eslint ." }}
命令
当初咱们能够在终端中执行 npm run test 执行对应的 script 脚本, 如下:
➜ xxx npm run test> xx@1.0.0 test /Users/beidan/Desktop/xxx> echo "Error: no test specified" && exit 1Error: no test specifiednpm ERR! code ELIFECYCLEnpm ERR! errno 1npm ERR! xx@1.0.0 test: `echo "Error: no test specified" && exit 1`npm ERR! Exit status 1npm ERR!npm ERR! Failed at the xx@1.0.0 test script.npm ERR! This is probably not a problem with npm. There is likely additional logging output above.npm WARN Local package.json exists, but node_modules missing, did you mean to install?npm ERR! A complete log of this run can be found in:npm ERR! /Users/beidan/.npm/_logs/2021-02-19T06_40_42_472Z-debug.log
如果间接在终端中执行 npm test, 也是能够失去一样的后果
➜ xxx npm test> xx@1.0.0 test /Users/beidan/Desktop/xxx> echo "Error: no test specified" && exit 1Error: no test specifiednpm ERR! code ELIFECYCLEnpm ERR! errno 1npm ERR! xx@1.0.0 test: `echo "Error: no test specified" && exit 1`npm ERR! Exit status 1npm ERR!npm ERR! Failed at the xx@1.0.0 test script.npm ERR! This is probably not a problem with npm. There is likely additional logging output above.npm WARN Local package.json exists, but node_modules missing, did you mean to install?npm ERR! A complete log of this run can be found in:npm ERR! /Users/beidan/.npm/_logs/2021-02-19T06_40_42_472Z-debug.log
这是因为,有些脚本是内置能够应用更短的命令来执行,更容易记住。例如,上面所有的命令的成果都是一样的:
npm run-script testnpm run testnpm testnpm t
同理, npm start 也是一样
npm run-script startnpm run startnpm start
执行多个脚本
咱们可能想联合一些脚本并一起运行它们。 为此,咱们能够应用 && 或 &
要顺次运行多个脚本,能够应用 && ,例如:
npm run lint && npm test
要并行运行多个脚本,能够应用& 例如:
npm run lint&npm test
留神:这仅实用于 Unix 环境。 在 Windows 中,它将按程序运行。
因而,咱们在理论我的项目中能够创立一个联合了两个脚本的脚本,以此来简化咱们的操作,如下所示:
{ "scripts": { "lint": "eslint .", "test": "echo \"Error: no test specified\" && exit 1", "ci": "npm run lint && npm test" // 此时 npm run ci 即会顺次执行 npm run lint , npm run test }}
pre & post
咱们能够为任何脚本创立 “pre” 和 “post” 脚本,NPM会主动按程序运行它们。惟一的要求是脚本的名称(后跟“pre”或“post”前缀)与主脚本匹配。例如:
{ "scripts": { "prehello": "echo \"--Pre \"", "hello": "echo \"Hello World\"", "posthello": "echo \"--post\"" }}
如果咱们执行 npm run hello, npm 会按以下程序执行脚本:prehello, hello, posthello。输入如下:
➜ xxx npm run hello> xx@1.0.0 prehello /Users/beidan/Desktop/xxx> echo "--Pre "--Pre> xx@1.0.0 hello /Users/beidan/Desktop/xxx> echo "Hello World"Hello World> xx@1.0.0 posthello /Users/beidan/Desktop/xxx> echo "--post"--post
谬误
当脚本以非 0 退出码完结时,这意味着在运行脚本的时候产生了谬误,并终止了执行。比方:
"scripts": { "test": "echo \"Error: no test specified\" && exit 1"}
那么在脚本抛出谬误时,咱们会失去一些其余的细节,比方谬误号 error 和代码,具体的谬误日志门路都能够在终端获取到,如下:
➜ xxx npm run test> xx@1.0.0 test /Users/beidan/Desktop/xxx> echo "Error: no test specified" && exit 1Error: no test specifiednpm ERR! code ELIFECYCLEnpm ERR! errno 1npm ERR! xx@1.0.0 test: `echo "Error: no test specified" && exit 1`npm ERR! Exit status 1npm ERR!npm ERR! Failed at the xx@1.0.0 test script.npm ERR! This is probably not a problem with npm. There is likely additional logging output above.npm WARN Local package.json exists, but node_modules missing, did you mean to install?npm ERR! A complete log of this run can be found in:npm ERR! /Users/beidan/.npm/_logs/2021-02-19T06_48_18_141Z-debug.log
静默音讯
如果想缩小谬误日志并非避免脚本抛出谬误, 能够应用上面的命令来“静默”解决, (比方在 ci 中,即便测试命令失败,也心愿整个管道持续运行,就能够应用这个命令)
npm run <script> --silent// 或者npm run <script> -s
如果脚本名不存在时不想报错,能够应用 --if-present ,比方: npm run <script> --if-present
日志等级
咱们能够应用--silent缩小日志,然而如何取得更具体的日志呢? 还是介于两者之间?
有不同的日志级别:
"silent", "error", "warn", "notice", "http", "timing", "info", "verbose", "silly".
默认值为“ notice”。 日志级别确定哪些日志将显示在输入中。 将显示比以后定义更高级别的任何日志。
咱们能够应用--loglevel <level>明确定义要在运行命令时应用的日志级别。
当初,如果咱们想获取更具体的日志,则须要应用比默认级别更高的级别(“notice”)。 例如:
--loglevel <info>
咱们还能够应用一些简短的版本来简化命令:
-s, --silent, --loglevel silent-q, --quiet, --loglevel warn-d, --loglevel info-dd, --verbose, --loglevel verbose-ddd, --loglevel silly
因而,要取得最高级别的详细信息,咱们能够应用上面的命令
npm run <script> -ddd // 或npm run <script> --loglevel silly
从文件中援用门路
如果脚本很简单的话,在 package.json 中保护显著会越来越简短,也越来越难保护,因而简单的脚本咱们个别会写在文件中,在
从文件中执行脚本。如下:
{ "scripts": { "hello:js": "node scripts/helloworld.js", "hello:bash": "bash scripts/helloworld.sh", "hello:cmd": "cd scripts && helloworld.cmd" }}
咱们应用 node <path.js> 来执行 JS 文件,应用 bash <path.sh> 来执行 bash 文件
值得注意的是,如果是 cmd 或 bat 文件, 则须要先 cd 导航到对应的文件夹目录,不能像 sh, js 文件一样,间接执行,否则会报错。
拜访环境变量
在执行 NPM 脚本时,NPM提供了一组咱们能够应用的环境变量。
咱们能够应用
npm_config_<val> 或者 npm_package_<val>
例如:
{ "scripts": { "config:loglevel": "echo \"Loglevel: $npm_config_loglevel\"", }}
终端输入如下:
➜ xxx npm run config:loglevel> xx@1.0.0 config:loglevel /Users/beidan/Desktop/xxx> echo "Loglevel: $npm_config_loglevel"Loglevel: notice
配置参数应用npm_config_前缀放入环境中。 这里有一些例子:
咱们能够应用上面的命令获取 config
npm config ls -l
传递参数
在某些状况下,您可能须要向脚本传递一些参数。 您能够应用命令开端的 -- 来实现这一点。
增加到脚本中的任何 -- 都会被转换成一个带有 npm 配置前缀的环境变量。
例如:
npm run <script>---<argument>="value"
例子:
{ "scripts": { "ttt": "echo \"ttt $npm_config_firstname!\"" }}
➜ xxx npm run ttt --firstname=234 // 传入> xx@1.0.0 ttt /Users/beidan/Desktop/xxx> echo "ttt $npm_config_firstname!"ttt 234! //输入的值
命名规定
前缀
有些开源我的项目咱们能够看到,他的 script 脚本是带有前缀的, 这也是一个好的命名规定,
通过:dev, :prod 来辨别环境, 如下:
{ "scripts": { "build:dev": "...", // 开发环境 "build:prod": "..." // 生产环境 }}
公众号:前端加加
关注「前端加加」, 第一工夫获取优质文章.
我组建了一个气氛特地好的阿里巴巴内推社群,如果你对退出阿里巴巴感兴趣的话(后续有打算也能够),咱们能够一起进行面试相干的答疑、聊聊面试的故事、并且在你筹备好的时候随时帮你内推。下方加 peen 好友回复「面试」即可。