如何使用cross-env配置多个环境（前端）

什么是cross-env

通过js在平台设置不同的环境变量的工具

怎么用？

第一步：安装

npm install --save-dev cross-env

第二步：指令

在package.json中的scripts加上一条：

// 使用cross-env配置一个环境变量env,且它的值为production生产环境
cross-env env=production webpack-dev-server --info=false --host 0.0.0.0 --hot --config ./build/webpack.dev.config.js

上指令的后半句：

// webpack.对应环境.config.js
webpack-dev-server --info=false --host 0.0.0.0 --hot --config ./build/webpack.dev.config.js

cross-env 以后可以写入下一步指令，即配置好环境变量后再执行下一步（启动服务等）

环境变量还可以是JSON，具体写法可以参考

{
  "scripts": {
    "test": "cross-env TS_NODE_COMPILER_OPTIONS={\\\"module\\\":\\\"commonjs\\\"} node some_file.test.ts"
  }
}

查看JSON写法文档
这样，我们就拥有了个全局变量啦！

第三步

在上一步，我们设置了个环境变量且赋值为’production‘

接下来我们可以写多个配置文件，引入这个环境变量，为啥要写多个配置文件呢？那是因为不同环境的配置需求是不一样的，例如，测试环境有A系列域名，开发环境有B系列域名等。

最后你可能有这么个文件目录：

最后一步

让我们回到第二步，执行指令吧！