方法一

• 在 vue-cli 里把我們需要配置修改的文件直接進(jìn)行抽離，不讓 webpack 把配置文件進(jìn)行編譯。

第一步：在 static 文件夾下新建一個名為 config.js 的文件

window.g={
    baseURL1:'http://localhost:8090',
    baseURL2:'/api'
}

第二步：在index.html里面引入這個config.js

<script src="./static/js/config.js"></script>

第三步：我們配置好之后就可直接調(diào)用

export  const baseURL1 = window.g.baseURL1
export  const baseURL2 = window.g.baseURL2  

方法二

2.1 第一步：在 static 文件夾中新建一個 project.config.json，把你要寫的配置寫入

{
    "baseURL1": "http://localhost:8090",
    "baseURL2": "/api",
    "company": "XXXXX"
  }

2.2 第二步：在 main.js 中請求定義的配置文件，并放到 Vue.prototype 中，使全局可訪問，注意，這里把new Vue()放在請求里執(zhí)行，是防止請求與頁面渲染之間的時間差異化導(dǎo)致值獲取不到，因此這樣比較保險。

// 定義外部接口可配置
import axios from 'axios'
let startApp = function () {
  axios.get('/static/project.config.json').then((res) => {
    // 基礎(chǔ)地址
    Vue.prototype.BASE_URL = res.BASE_URL;

    new Vue({
      el: '#app',
      router,
      store,
      components: {
        App
      },
      template: '<App/>'
    })
  })
}

startApp()

2.3 第三步：如果在 .vue 文件中使用：

console.log(this.BASE_URL)

2.4 如果在一些 .js 文件中，可以調(diào)用Vue后再使用：

    import Vue from 'vue'
    console.log(Vue.prototype.BASE_URL)