vue-cli2/vue-cli3之抽离打包请求之config

场景需求:

　　因为可能分为很多请求场景，所以不能换一次请求就打包一次，所以得把请求地址放到打包好的一个静态包里面改变

vue-cli2版本的

　　static/config/index.js

const peconfig = 'development';
switch (peconfig) {
  case 'development':
    var tes1 = 'www.开发的.com';
    break;
  case 'production':
    var tes1 = 'www.部署的.com';
    break;
  case 'test':
    var tes1 = 'www.测试的.com';
    break;
}
window.g = {
  peconfig: peconfig,
  testUrl: tes1 // 配置服务器地址,
};

index.html

在body上面加载script

<script type="text/javascript" src="/static/config/index.js"></script>

然后就可以在其他页面引用了，比如我在HelloWorld.vue引用

var baseURLStr = window.g;
    console.log('pub', baseURLStr);

当你打包之后，改动了dist里面所对应的config后，地址就会直接变了

vue-cli3版本的

其实cli3和cli2大致上差不多

public/config/index.js

const peconfig = 'development';
switch (peconfig) {
  case 'development':
    var tes1 = 'www.开发的.com';
    break;
  case 'production':
    var tes1 = 'www.部署的.com';
    break;
  case 'test':
    var tes1 = 'www.测试的.com';
    break;
}
window.g = {
  peconfig: peconfig,
  testUrl: tes1 // 配置服务器地址,
};

public/index.html

<script type="text/javascript" src="/config/index.js"></script>