vue-element-template 开发环境、测试环境、运行环境配置

1、文件\.env.development中配置的域名是开发运行环境 - 对应命令 npm run dev：
开发过程中执行npm run dev即可访问到

在文件\.env.development中配置：VUE_APP_BASE_API = 'https://aa-test.com'
在页面中访问：console.log(process.env.VUE_APP_BASE_API)
执行命令：npm run dev 即可访问上面配置的域名：https://aa-test.com

2、文件\.env.production中配置的域名是正式环境（可理解为编译环境1） - 对应命令 npm run build:prod：
执行：npm run build:prod当打包编译后即可访问到

在文件\.env.production中配置：VUE_APP_BASE_API = 'https://aa.com'
在页面中访问：console.log(process.env.VUE_APP_BASE_API)
执行命令：npm run build:prod，并把项目放至服务器即可访问上面配置的域名：https://aa.com

3、文件\.env.staging中配置的域名是测试环境（可理解为编译环境2） - 对应命令 npm run build:stage：
执行：npm run build:stage当打包编译后即可访问到

在文件\.env.staging中配置：VUE_APP_BASE_API = 'https://aa-test.com'
在页面中访问：console.log(process.env.VUE_APP_BASE_API)
执行命令：npm run build:stage，并把项目放至服务器即可访问上面配置的域名：https://aa-test.com

最重要的点在request.js中配置

const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_API, 
  timeout: 5000000 // request timeout
})

package.json文件中配置：

image.png

vue.config.js文件中配置：

proxy: {
      '/api': {
        target: process.env.VUE_APP_BASE_API,
        changeOrigin: true,
        ws: true,
        pathRewrite: {
          '^/': ''
        }
      }
    },