vue配置dev、test、pro环境，实现分环境打包

vue配置dev、test、pro环境，实现分环境打包

使用vue-cli开发项目时，默认自带的环境有development（开发环境）、production（生产环境），在最近开发的一个项目中，后端是由.net和java共同开发的，为了适应和提高多环境多域名的打包配置效率，前端需要分环境配置不同的打包命令；下面就来讲讲如何配置test环境，实现测试环境的一键打包命令：npm run test。

1、package.json文件中新增命令行脚本test命令,并指向build文件夹下的test.js。

2、在build的文件夹下面新建一个test.js文件，内容可直接复制build.js文件的内容，将如下红色框内的内容中的prod、production修改为test。

3、在config文件夹下创建test.env.js文件，此时项目中多了一个test环境。

4、build文件夹下面新建一个webpack.test.conf.js文件，内容可以直接复制webpack.prod.conf.js内容,将红色框的prod改为test，构建时就会去config文件夹下的test.env.js寻找测试环境变量。

5、修改webpack.test.conf.js文件中的红色框内容，执行npm run test构建时会将打包的文件放在test文件目录中。

6、在config=》index.js文件中添加如下test配置（内容可复制build模块内容，修改红色框的参数。

7、在src下面封装自己的接口配置文件config.js。

8、根据项目需求，引入config.js文件

以上就是我分环境打包配置的爬坑之记：
测试环境打包：npm run test; 生产环境：npm run build，希望能对大家有所帮助。
如项目中还需配置其它环境，可依照上述步骤配置，提高开发效率，减少开发和沟通成本，能不动嘴的绝不动嘴，哈哈。。。