vue动态获取接口域名

域名一般是打包到项目里面的，打包后不能动态配置，只能通过不同的指令来动态切换域名。

后台说增加一个配置文件，动态更改域名。查了查网上，现记录下步骤。
1、安装插件

npm install --save-dev generate-asset-webpack-plugin

2、新建配置文件（我是将配置文件放置在public文件夹内）
在项目的public目录下新建 serverconfig.json 以后会根据这个文件去生成打包的配置文件

{"produrl":"http:www.baidu.com"}

3、第三步 引入generate-asset-webpack-plugin

在build/webpack.prod.conf.js中添加

const generateassetplugin = require('generate-asset-webpack-plugin');
const serverconfig = require('../public/serverconfig.json')；//引入根目录下的配置文件

const createjson = function() {
 return JSON.stringify(serverconfig);
};

//plugins 中使用
 plugins: [
  //打包时生成一个配置文件
  new generateassetplugin({
   filename: 'serverconfig.json',
   fn: (compilation, cb) => {
     cb(null, createjson());
   },
 }),
]

4、第四步 使用配置文件中的内容
这里根据不同项目不同需求代码自行变换，我分享一下我的项目里的使用。在main.js 中vue实例初始化之前将baseurl存到本地

axios.get('./serverconfig.json').then( e => {
 let baseurl = e.data.produrl
 window.localStorage.setItem("baseurl", baseurl);
 new vue({
  el: '#app',
  router,
  render: h => h(app)
 })
})

打包后的目录

上传到服务器就好了。接下来就可以不用再重新build了