前端配置提取 让开发和上线更加简便

web/.env.development

@@ -1,3 +1,6 @@
 ENV = 'development'
+
+VUE_APP_CLI_PORT = '8080'
+VUE_APP_SERVER_PORT = '8888'
 VUE_APP_BASE_API = '/api'
 VUE_APP_BASE_PATH = 'http://127.0.0.1'

web/.env.production

@@ -1,4 +1,7 @@
 ENV = 'production'
+
+VUE_APP_CLI_PORT = '8080'
+VUE_APP_SERVER_PORT = '8888'
 VUE_APP_BASE_API = '/api'
 #下方修改为你的线上ip
 VUE_APP_BASE_PATH = 'http://8.141.61.63' 

web/src/main.js

@@ -1,6 +1,5 @@
 import Vue from 'vue'
 import App from './App.vue'
-import buildConfig from '../build.config';
 
 //  按需引入element
 import {
@@ -152,7 +151,7 @@ console.log(`
        欢迎使用 Gin-Vue-Admin
        当前版本:V2.4.1
        加群方式:微信：shouzi_1994 QQ群：622360840
-       默认自动化文档地址:http://127.0.0.1:` + buildConfig.goServerPort + `/swagger/index.html
-       默认前端文件运行地址:http://127.0.0.1:`+ buildConfig.vueClientPort + `
+       默认自动化文档地址:http://127.0.0.1:` + process.env.VUE_APP_SERVER_PORT + `/swagger/index.html
+       默认前端文件运行地址:http://127.0.0.1:`+ process.env.VUE_APP_CLI_PORT`
        如果项目让您获得了收益，希望您能请团队喝杯可乐:https://www.gin-vue-admin.com/docs/coffee
 `)

web/vue.config.js

@@ -15,7 +15,7 @@ module.exports = {
     lintOnSave: process.env.NODE_ENV === 'development',
     productionSourceMap: false,
     devServer: {
-        port: buildConf.vueClientPort,
+        port: process.env.VUE_APP_CLI_PORT,
         open: true,
         overlay: {
             warnings: false,
@@ -25,7 +25,7 @@ module.exports = {
             // 把key的路径代理到target位置
             // detail: https://cli.vuejs.org/config/#devserver-proxy
             [process.env.VUE_APP_BASE_API]: { //需要代理的路径   例如 '/api'
-                target: `http://127.0.0.1:` + buildConf.goServerPort + `/`, //代理到 目标路径
+                target: `${process.env.VUE_APP_BASE_PATH}:${process.env.VUE_APP_SERVER_PORT}/`, //代理到 目标路径
                 changeOrigin: true,
                 pathRewrite: { // 修改路径数据
                     ['^' + process.env.VUE_APP_BASE_API]: '' // 举例 '^/api:""' 把路径中的/api字符串删除