超大js文件多层级引用缓存在网络较差的时候无法调用使用问题
问题背景
ayer.js 在后台管理的模板是加载的,但是当他在无缓存的时候layer就没用调用,使用下面多层js引入,当一个开发仔在打开f12的时候,没有点击停用缓存就会发现无法唤起js
开发仔的通病,上来先打开12调试,框架底层刚开始是加载layer.js 他下级还有两个js没唤起 layer.js会异步加载两个/static/admin/lib/layui/lay/modules/form.js /static/admin/lib/layui/lay/modules/layer.js导致出现问问题 单独请求这两个js url路径你会发现没问题
报错如下
3xadmin.js:89 Uncaught ReferenceError: layer is not definedat Xadmin.open (xadmin.js:89:18)at HTMLButtonElement.onclick (goodsList:60:137)
调用堆栈
请求调用堆栈n.use @ layui.js:2(匿名) @ xadmin.js:200
请求启动器链
https://wechat.encg21.com/admin/goods/goodsList
https://wechat.encg21.com/static/admin/lib/layui/layui.js
https://wechat.encg21.com/static/admin/lib/layui/lay/modules/layer.js
停用缓存
当你关闭停用缓存发现又可以了
总结
这里经常打开开发仔调试项目容易出现这个坑,踩过了记录一下,这东西ai真问不出来
1. 框架底层刚开始是加载layer.js 他下级还有两个js没唤起 layer.js会异步加载两个/static/admin/lib/layui/lay/modules/form.js /static/admin/lib/layui/lay/modules/layer.js导致出现问问题 单独请求这两个js url路径你会发现没问题
2. 点击这个按钮的时候因为停用缓存导致需要重新加载这时候已经没有这个js了 从缓存角度来说这样做是没问题的,但是开着f12点击停用缓存就有问题了