关于vue-cli项目配置多环境
基于vue-cli搭建的项目环境，一般来说默认只有开发环境和生产环境，但实际工作中，还需要一个线上测试环境。第一次配置的时候找了很多资源，但大多都没有特别详细。今天整理一个算是很详细的配置多环境步骤，希望可以帮助到有需要的人～
搭建测试环境
- 在 config文件夹 里，新建一个pre.env.js（自定义名字）这里也可以直接复制一份dev.env.js，自行修改里面的名称
'use strict'
module.exports = {
NODE_ENV: '"pre"' // 自定义名字
- 在package.json 中 script 标签里加上一句
"build:pre": "cross-env NODE_ENV=pre env_config=pre node build/build.js"
这里的意思是，当执行npm run build:pre时，执行config文件里面pre的文件
直接这样做是会报错的，还要安装cross-env这个包 使用 npm install --save cross-env
在使用vue-cli时，npm run build 是被默认写成执行pro(生产环境)的，因此，执行以上代码，并没有正确运行测试环境。 在build文件夹里，webpack.prod.conf.js文件：
可见原来的env是引入的prod.env:
// const env = require('../config/prod.env')
修改为： const env = require ('../config/' + process.env.env_config + '.env')
自己可以打印一下 这时process.env.env_config 所指向的时npm run build：传的值
这时正确使用npm run build:pre 是可以打包成功的， 但是由于将原本固定的prod.env修改为了动态的， 所以在执行npm run build 会报错 因为在package.json中 原有的script中build写的执行文件直接是build.js,指向的是原来写死的prod.env.js文件。 需要修改biuld：
"cross-env NODE_ENV=production env_config=prod node build/build.js"
跟build:pre不同的是 node_env需要指向config中的文件名称，与之对应的是env_config的名字。 这样便可以打包成功了。 build.js中有一段描述： const spinner = ora('building for prod....') 可以动态修改为： const spinner = ora('building for ' + process.env.env_config)