vue 配置开发环境和生产环境，通过不同的指令打出不同的包

一个vue项目(基于vue-cli 和webpack)之后，我们可以通过 npm run dev来让这个项目跑起来。

怎么样才能配置不同的指令，build不同环境的包呢，通过网上查询，总结了一套自己的方法。

现在，想要npm run build 打包出正式包，npm run test 打出测试包

1.打开package.json，增加一条

2.将/config/prod.env.js修改为

'use strict'
// module.exports = {
//   NODE_ENV: '"production"'
// }
const target = process.env.npm_lifecycle_event;
if (target == 'test') {
    //测试
    var obj = {
        NODE_ENV: '"production"',
        API_ROOT:'"测试测试"',
    }
}else if(target == 'build') {
    //线上
    var obj = {
        NODE_ENV: '"production"',
        API_ROOT: '"正式正式正式"',
    }
}
module.exports = obj;

3.将/config/dev.env.js修改为

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

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  API_ROOT:'"测试测试"',
})

4.此时，在main.js，

运行 npm run dev

运行 npm run build（先修改相对路径，自行百度）

此时打出的就是正式包

运行 npm run test（先修改相对路径，自行百度）

此时打出的就是测试包

 

 

 

这样就可以方便的进行开发了