目的：

npm run build:uat 打测试包（环境：development）
npm run build:prod 打正式包（环境：production）

修改配置：

• 第一步：修改config/prod.env.js

'use strict'
module.exports = {
  NODE_ENV: '"production"',
  EVN_CONFIG:'"prod"'
}

• 第二步：config/dev.env.js

'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  EVN_CONFIG:'"dev"'
})

• 第三步：添加config/test.env.js

'use strict'
module.exports = {
  NODE_ENV: '"development"',
  EVN_CONFIG:'"test"'
}

• 第四步：修改config/index.js,修改build那一部分的代码，其他不变

build: {
    // 添加test、prod环境变量配置
    prodEnv: require('./prod.env'),
    testEnv: require('./test.env'),

    //如果需要通过打包不同的环境变量，打包到不同的文件夹可以这样写,注意用了此处代码需要注释点下面的index和assetsRoot这两个配置
    // index: path.resolve(__dirname, '../' + process.env.EVN_CONFIG + '_dist/index.html'),
    // assetsRoot: path.resolve(__dirname, '../' + process.env.EVN_CONFIG + '_dist'),
  }

• 第五步：修改build/build.js,注释process.env.NODE_ENV = 'production然后修改spinner。

// 注释这里
// process.env.NODE_ENV = 'production'

// 修改这里
// const spinner = ora('building for production...')
var spinner = ora('building for ' + process.env.NODE_ENV + ' of ' + process.env.EVN_CONFIG+ ' mode...' )
spinner.start()

• 第六步：修改build/webpack.prod.conf.js

// 注释
// const env = require('../config/prod.env')

// 新增
const env = config.build[process.env.EVN_CONFIG+'Env']

• 第七步：修改package.json 打包命令

build:uat 打包测试环境
build:prod 打包正式环境

"build": "cross-env NODE_ENV=production EVN_CONFIG=prod node build/build.js",
"build:uat": "cross-env NODE_ENV=development EVN_CONFIG=test node build/build.js",
 "build:prod": "cross-env NODE_ENV=production EVN_CONFIG=prod node build/build.js"

注意：按照配置修改后，原来的命令 npm run build就不能使用了，所以其也要修改一下配置

• 第八步：安装依赖

npm install --save-dev cross-env

• 第九步：运行打包命令

测试环境：npm run build:test
正式环境：npm run build:prod

• 第十步：获取环境变量

把包放在服务器中访问，process.env.NODE_ENV即可获取到环境变量

完成以上配置就可以按照自己配置的打出不同环境变量的包