VUE2 分环境打包及开发

1、在src下新建utils文件夹

2、在utils文件夹内新建baseURL.js文件

module.exports = {
  local: 'http://localhost:8080/test/api/v1', // 本地环境
  development: 'http://192.168.1.1:8080/test/api/v1', // 开发环境
  test: 'http://192.168.2.2:8080/test/api/v1', // 测试环境
  production: 'http://192.168.3.3:8080/test/api/v1', // 生产环境
  otherUrl: 'http://192.168.4.4:8080/test/api/v1' // 其他环境
}

3、修改package.json中的scripts参数

"scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "dev_local": "webpack-dev-server --inline --progress --env=local --config build/webpack.dev.conf.js",
    "dev_test": "webpack-dev-server --inline --progress --env=test --config build/webpack.dev.conf.js",
    "dev_prod": "webpack-dev-server --inline --progress --env=prod --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "lint": "eslint --ext .js,.vue src",
    "build": "node build/build.js"
  },

4、修改config里的index.js文件

const url = require('../src/utils/baseUrl.js')
let target
if (process.argv.length > 4) {
  switch (process.argv[4]) {
    case '--env=local':
      target = url.local
      break
    case '--env=test':
      target = url.test
      break
    case '--env=prod':
      target = url.production
      break
    default:
      target = url.development
  }
} else {
  switch (process.argv[2]) {
    case 'local':
      target = url.local
      break
    case 'test':
      target = url.test
      break
    case 'prod':
      target = url.production
      break
    default:
      target = url.development
  }
}

5、用target来配置代理

6、启动及打包命令如下

npm run dev
npm run dev_local
npm run dev_test
npm run dev_prod
npm run build
npm run build local
npm run build test
npm run build prod