vue配置不同环境打包项目（dev、test、prod）

1.安装cross-env

npm install --save-dev cross-env

2.修改package.json文件，自定义打包命令 

  "scripts": {

    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",

    "start": "npm run dev",

    "build": "node build/build.js",

    "build--test": "cross-env NODE_ENV=testing env_config=test node build/build.js",

    "build--prod": "cross-env NODE_ENV=production env_config=prod node build/build.js"

  },

3.修改config文件，添加对应环境的xxx.env.js文件

添加的测试环境文件

test.env.js文件

module.exports = {

  NODE_ENV: '"testing"',

  ENV_CONFIG: '"test"', 

}

prod.env.js

module.exports = {

  NODE_ENV: '"production"',

  ENV_CONFIG: '"prod"'

}

dev.env.js

const merge = require('webpack-merge')

const prodEnv = require('./prod.env')

module.exports = merge(prodEnv, {

  NODE_ENV: '"development"'

})

4.修改打包配置
打开build/webpack.prod.conf.js文件

const env = config.build[process.env.env_config + 'Env'];

// const env = require('../config/'+process.env.env_config+'.env')

    修改
    build/build.js

var spinner = ora('building for ' + process.env.NODE_ENV + ' of ' + process.env.env_config + ' mode...')

spinner.start()

写入api文件

api文件夹

api/index.js文件

执行npm run build--test 、npm run build--prod 打包不同环境