【分享】并行或串行运行多个NPM脚本的CLI工具

简介: 【分享】并行或串行运行多个NPM脚本的CLI工具

背景介绍:


我们的node项目的脚本通通都是放在了package.jsonscripts节点下面,当我们要在一个命令执行完后接着去执行下一个命令的时候(如:打包后需要推送打包内容到服务器)就需要增加一条脚本并使用&&进行拼接两条或多条命令来实现,并且符号&在windows下的cmd.exe是不兼容的。


本期介绍的主角(npm-run-all):


今天主要想分享一个比较不错的Node包,我们可以通过提供的命令来制定脚本的执行计划,在你开发Node应用、Cli工具或着有复杂的多条script需要执行的时候会很有帮助,同样也是在掘金学到的知识再分享一下😂。


🍔有什么用?


  1. 简化脚本:

使用前: npm run clean && npm run build:css && npm run build:js && npm run build:html

使用后: npm-run-all clean build:*

  1. 跨平台:

主要是因为Windows用户通常使用的cmd.exe不支持&来拼接多条命令,但用户量又大。


🍟怎么安装?


Node版本>=4均可

命令:

npm install npm-run-all --save-dev
yarn add npm-run-all --dev
复制代码


🌭怎么使用?


具体案例可参考文末整理的思维导图或项目的readme文件

  1. 定制复杂计划:npm-run-all
  2. 定制串行计划:run-s


  • 案例:


使用前:

npm run clean && npm run lint && npm run build


使用后:

run-s clean lint build

  • Examples
run-s build:*
run-s build:**
run-s lint clean build:**
run-s --silent --print-name lint clean build:**
run-s -sn lint clean build:**
复制代码


  1. 定制并行计划:run-p


  • 案例:


使用前:

npm run lint & npm run build


使用后:

run-p lint build

  • Examples
run-p watch:**
run-p --print-label "build:** -- --watch"
run-p -l "build:** -- --watch"
run-p start-server start-browser start-electron
复制代码
  1. 在NodeJS里面使用


综上所述的出的结论:


  1. 缺点1:脚本冗余;
  2. 缺点2:跨平台能力差。


命令支持:

{
    "scripts": {
        "clean": "rimraf dist",
        "lint":  "eslint src",
        "build": "babel src -o lib"
    }
}
复制代码
  1. npm run 执行:npm run clean && npm run lint && npm run build
  2. run-s执行:run-s clean lint build
  • run-p:并行执行示例:
{
    "scripts": {
        "clean": "rimraf dist",
        "lint":  "eslint src",
        "build": "babel src -o lib"
    }
}
复制代码
  1. npm run 执行:npm run lint & npm run build
  2. run-p执行:run-p lint build
  3. 提示:
  1. 代码非正常退出其他脚本将终止进程;
  2. & 操作符在windows系统的cmd.exe不被支持。

1.png





相关文章
|
2天前
设置VSCode运行任务命令快捷键Alt+R,通常用于npm start(对频繁使用该命令可节省50%的输入命令行打字时间)
设置VSCode运行任务命令快捷键Alt+R,通常用于npm start(对频繁使用该命令可节省50%的输入命令行打字时间)
|
2天前
|
JavaScript 前端开发
写了一个javaScript数据类型判断的工具(npm--genius-type)
写了一个javaScript数据类型判断的工具(npm--genius-type)
|
6月前
|
Windows
ts-node : 无法加载文件 C:\Users\Dell\AppData\Roaming\npm\ts-node.ps1,因为在此系统上禁止运行脚本。有关详细信息
ts-node : 无法加载文件 C:\Users\Dell\AppData\Roaming\npm\ts-node.ps1,因为在此系统上禁止运行脚本。有关详细信息
113 0
|
2天前
|
前端开发 JavaScript 开发者
探秘npm:解锁前端生态的魔法工具
探秘npm:解锁前端生态的魔法工具
|
2天前
|
Windows
vscode 终端无法执行npm、cnpm命令的解决办法,npm : 无法将“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请确保路径正确,然后再试
vscode 终端无法执行npm、cnpm命令的解决办法,npm : 无法将“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请确保路径正确,然后再试
55 0
|
6月前
|
前端开发 JavaScript
npm : 无法将“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称
npm : 无法将“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称
168 0
|
6月前
|
缓存 资源调度 JavaScript
从零到一nvm、npm、cnpm、yarn、vue全套安装和环境配置以及创建新项目和如何运行人家的项目大全,最详细,保姆级
从零到一nvm、npm、cnpm、yarn、vue全套安装和环境配置以及创建新项目和如何运行人家的项目大全,最详细,保姆级
236 0
|
2天前
|
JavaScript 前端开发 API
npm 包管理工具
npm 包管理工具
50 0
|
2天前
|
域名解析 JavaScript 前端开发
【面试题】三面 面试官:运行 npm run xxx 的时候发生了什么?
【面试题】三面 面试官:运行 npm run xxx 的时候发生了什么?
|
2天前
|
前端开发 JavaScript 开发者
探索npm的高级特性:自定义脚本与包的发布与维护
探索npm的高级特性:自定义脚本与包的发布与维护

推荐镜像

更多