“Loading chunk xxx failed”是Webpack动态导入分包加载失败所致，与Layui无关；根本原因在于构建配置、资源路径或缓存不一致，需检查publicPath、CDN部署及HTML缓存，而非修改Layui代码。
“Loading chunk xxx failed” 是 Webpack 分包加载失败的报错，和 Layui 本身无关
这个错误不会出现在纯 Layui 项目里。Layui 是一个不依赖 Webpack 的前端 UI 库，它本身没有 code splitting、chunk hash 或动态 import() 机制。如果你在用 Layui 的同时看到这个提示，说明你实际是在用 Vue/React + Webpack 打包的项目里引入了 Layui（比如通过 import layui from 'layui' 或 webpack 的 externals 配置不当），或者用了基于 Webpack 封装的 Layui 二次封装包。
关键判断点：console.log 报错堆栈里如果出现 __webpack_require__.e、require.ensure、import()，那就 100% 是 Webpack 动态导入出问题，不是 Layui 的锅。
排查 chunk 加载失败的三个真实路径
别在 Layui 文档里找答案，去查你的构建配置和部署环境：
-
CDN 或静态资源路径配错了：Webpack 输出的
chunk-xxx.js文件没上传到服务器，或 Nginx/Apache 没配好静态文件路由，导致浏览器请求返回 404。检查 Network 面板里那个 chunk URL 是否能直接访问 -
publicPath 配置不匹配：Webpack 的
output.publicPath设成了/assets/，但实际资源放在/static/js/下，浏览器就会去错地方找 chunk；常见于微前端、嵌入式子应用场景 -
缓存或版本冲突：HTML 页面缓存了旧版
main.js，但它引用的 chunk 名是chunk-abc123.js，而新版构建输出的是chunk-def456.js，旧 HTML 找不到对应文件。清缓存、加版本号、用 contenthash 命名都能缓解
为什么你改了 Layui 的 JS 文件也压根没用
因为这个错误发生在 JS 执行前的模块加载阶段——Webpack 还没开始执行 layui.js 里的任何代码，就已经卡在加载某个分包上了。你在 layui.js 里加 try/catch、改 table.render 参数、甚至删掉所有 Layui 调用，都拦不住这个报错。
真正有效的干预点只有两个：
- 在 Webpack 配置里加
Promise.allSettled包裹动态 import，捕获失败并 fallback（需 Webpack 5+） - 在 HTML 的
<script>标签上加onerror处理，例如：<script src="chunk-xxx.js" onerror="console.warn('chunk load failed')"></script>
如果你确实想让 Layui 和 Webpack 共存，最稳的做法
放弃动态 import Layui，改用传统 script 标签外链引入，并在 webpack.config.js 中用 externals 排除：
module.exports = {
externals: {
layui: 'layui'
}
};
然后在 HTML 里手动加：
<script src="/path/to/layui.js"></script>
这样 Webpack 就不会尝试打包或分割 Layui 相关代码，也就不会触发 chunk 加载逻辑。所有 layui.use 调用都走全局变量，彻底绕开模块加载异常。
真正的难点从来不在怎么 catch 这个错误，而在于确认它到底是不是你该负责的问题——很多时候，它只是上游构建流程漏掉了一个文件，或是运维没同步最新 dist 目录。
