env配置开发、测试、正式环境

        每次打包上传代码都要来回切换不同环境的服务器地址，不仅麻烦，而且经常会弄混乱，导致线上出错。

一、在根目录创建.env文件

具体查看官方文档：模式和环境变量 | Vue CLI

1、开发环境（.env.development）

NODE_ENV = development
VUE_APP_API_URL = 'http://*****'
VUE_APP_SERVER_URL = ''

2、测试环境（.env.test）

NODE_ENV = test
VUE_APP_API_URL = 'http://****'
VUE_APP_SERVER_URL = '/api'

3、正式环境（.env.production）

NODE_ENV = production
VUE_APP_API_URL = 'http://*****'
VUE_APP_SERVER_URL = '/api'

二、修改config.js

const {
  defineConfig
} = require('@vue/cli-service')
module.exports = defineConfig({
  // 打包后的目录
  outputDir: process.env.outputDir,
  // 配置代理服务
  devServer: {
    proxy: process.env.VUE_APP_API_URL,
  }
})

三、配置运行方法（package.json）

"scripts": {
    "start": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "test": "vue-cli-service build --mode test",   // 打包测试
    "pro": "vue-cli-service build && vue-cli-service build --mode test"  // 打包测试和线上
  },

打包命令为：

test：npm run test