cross-env: 如何使用umi配置多环境打包

前言

我们在打包前端代码的时候，经常会遇到测试环境和正式环境使用的接口以及一系列环境配置都不一样的情况，这个时候如果每次都手动去修改相应的config文件的话，会给开发带来很多不必要的麻烦。
因此，我们就可以引入cross-env来给我们的项目配置不同环境下的打包规则。

cross-env安装

使用下方指令安装cross-env到当前项目中

npm install --save-dev cross-env

打包指令

cross-env安装完成后，我们就可以编写相应的打包指令。
NODE_ENV就是给当前打包的环境设置一个常量，以便在config文件中选择生成对应配置。
一般较常使用的常量为production和development，分别指代正式环境和开发环境，也可以自己选择其他常量名称。
最后的 --config build/webpack.config.js则是在当前打包文件中要运行的config文件

{
  "scripts": {
    "build": "cross-env NODE_ENV=production webpack --config build/webpack.config.js",
    "build-dev": "cross-env NODE_ENV=devlopment webpack --config dev/webpack.config.js"
  }
}

配置文件的设置

配置文件可以如上面的指令所示，将dev环境和prod环境的config分开设置，也可以只使用一个config文件，里面再根据NODE_ENV常量分别读取不同配置。