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>
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步