npm script工作流(六) 跨平台兼容

主要内容

• 文件系统操作(创建、删除、移动、复制):
  删除文件和目录: rimraf:https://github.com/isaacs/rimraf
  拷贝、复制文件和目录： del-cli:https://www.npmjs.com/package/del-cli
  创建目录： make-dir-cli:https://www.npmjs.com/package/make-dir-cli
• cross-var插件
• cross-env 插件

---

Windows和Linux下两套命令

{
  "name": "hello-npm-script",
  "scripts": {
    "bash-script": "echo Hello $npm_package_name",
    "win-script": "echo Hello %npm_package_name%"
  }
}

---

文件系统操作

• 删除文件和目录：rimraf(https://github.com/isaacs/rimraf)、del-cli(https://www.npmjs.com/package/del-cli) 类似于：rm -rf
• 拷贝、复制文件和目录： cpr(https://www.npmjs.com/package/cpr)类似于cp -r
• 创建目录：make-dir-cli(https://www.npmjs.com/package/make-dir-cli) ，类似于 mkdir -p

具体使用：

添加依赖

npm i rimraf cpr make-dir-cli -D
# npm install rimraf cpr make-dir-cli --save-dev
# yarn add rimraf cpr make-dir-cli -D

修改package.json

• before：

{ "cover:cleanup": "rm -rf coverage && rm -rf .nyc_output"}

• after:

  {
   "cover:cleanup": "rimraf coverage && rimraf .nyc_output"
  }

• 替换说明：
  1、 rm -rf 直接替换成 rimraf；
  2、 mkdir -p 直接替换成 make-dir；
  3、cp -r 的替换需特别说明下，cpr 默认是不覆盖的，需要显示传入 -o 配置项，并且参数必须严格是 cpr <source> <destination> [options] 的格式，即配置项放在最后面；
  4、把 cover:cleanup 从 postcover 挪到 precover 里面去执行，规避 cpr 没归档完毕覆盖率报告就被清空的问题；

cross-var 引用变量的兼容

Linux 下引用方式： $npm_package_name，
Windows 下引用方式： %npm_package_name%
在 npm script 中使用变量对此做兼容

安装

npm i cross-var -D
# npm install cross-var --save-dev
# yarn add cross-var -D

修改package.json

• before

{
  "name": "hello-npm-script",
  "scripts": {
    "bash-script": "echo Hello $npm_package_name",
    "win-script": "echo Hello %npm_package_name%"
  }
}

• after：

  {  
"common-script": "cross-var echo Hello $npm_package_name"
}

• 上述安装会安装babel，可以安装如下纯净版(不含babel的版本)
  cross-var-no-babel(https://www.npmjs.com/package/cross-var-no-babel)

cross-env 环境变量兼容

• cross-env(https://www.npmjs.com/package/cross-env)
  NODE_ENV=test

添加依赖

$ npm i cross-env -D
$ # npm install cross-env --save-dev
$ # yarn add cross-env -D

修改package.json

  "scripts": {
-    "test": "NODE_ENV=test mocha tests/",
+    "test": "cross-env NODE_ENV=test mocha tests/",
  }

更多兼容性包

• npmjs.com : https://www.npmjs.com/search?q=cross%20platform