webpack打包VUE項目讀取外部配置文件，靈活配置域名

　　作為一個兼職前端和運維的java程序員，今天我司測試人員提出了一個需求，當后台服務地址ip地址改變后，webpack打包的VUE項目得更改地址重新打包，太麻煩了，最好可以讀取外部配置文件的域名，靈活部署。

　　這不是在刁難我胖虎嗎，后來我在網上查資料，發現有解決思路，具體詳細的解決方案沒有，在和前端同事研究后，解決了該問題，現記錄一下，供大家遇到此問題時參考。

　　我司的前端項目我是用nginx部署的，原配置文件prod.env.js代碼如下：

　　

module.exports = {
  NODE_ENV: '"production"',
  ENV_CONFIG: '"prod"',
  BASE_API: '"http://192.168.1.24:8081"'
}

　　在打包成dist文件夾后，確實無法改變地址，解決思路是在VUE項目的static文件夾下創建config.json文件，里面配置后台地址：

"http://192.168.1.21:8081"

　　然后就可以在prod.env.js中使用這個地址：

var URL = require('../static/config.json');
console.log(URL)
module.exports = {
  NODE_ENV: '"production"',
  ENV_CONFIG: '"prod"',
  BASE_API: "'"+URL+"'"
}

　　通過require引入，這里踩坑了一次，這個URL讀出來不是字符串，如果在項目中別的地方引用，如：

baseUrl: process.env.BASE_API

　　引起報錯，有兩個：符號，頁面編譯不出來，要把URL變成字符串使用，到此這個需求解決。