layui.config() 是 Layui 模块路径配置的唯一入口,必须在 layui.js 加载后、lay.use() 前调用;base 决定模块查找起始目录(须以/结尾),extend 用于个别模块路径映射,version 控制 JS 缓存行为,禁止多次调用覆盖配置。
layui.config() 是唯一推荐的全局路径配置入口
所有模块加载路径的源头控制,必须通过 layui.config() 实现。它不是可选项,而是 layui 模块系统识别路径的唯一生效机制——绕过它直接改 layui.cache 或硬写绝对路径,会导致模块加载失败、缓存失效或调试模式异常。
常见错误现象:lay.use(['myModule']) 报错“module not found”,但文件明明存在;或者开发时模块能加载,上线后突然 404——大概率是没配 base 或路径拼写不匹配。
-
base是核心:它决定lay.use()查找模块的起始目录,必须以/结尾(如'./modules/'),否则扩展模块路径会错位 - 路径支持相对与绝对:
base: './modules/'(相对 HTML)、base: '/static/js/modules/'(根路径)、base: 'https://cdn.example.com/layui-modules/'(CDN)均可,但不要混用协议(比如 base 用 http,而 extend 里又写 https) - 千万别在
layui.js加载前调用layui.config()——它依赖全局layui对象,必须放在<script src="layui.js"></script>之后、任何lay.use()之前
base 和 extend 的分工必须理清
base 管“默认找哪”,extend 管“个别模块放哪”——这是两个层级的路径控制,不是互斥关系,而是叠加生效。
使用场景:你有 80% 的自定义模块放在 /assets/js/modules/,但有个 Vue 集成模块托管在 CDN,就该这样配:
layui.config({
base: '/assets/js/modules/',
version: '2.9.14'
}).extend({
vue: 'https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.min.js',
auth: 'auth/authModule' // → 实际路径:/assets/js/modules/auth/authModule.js
});
容易踩的坑:
-
extend里的值不加.js后缀(Layui 自动补);但若指向 CDN,就必须是完整 URL(含协议和后缀) -
extend中的模块名不能和 Layui 原生模块重名(如layer、form),否则覆盖原模块导致功能异常 - 如果
extend某个模块路径写错,Layui 不报错,而是静默 fallback 到默认路径,排查时容易漏掉
version 参数不是摆设,它直接影响缓存行为
version 控制的是模块 JS 文件的 URL 查询参数,不是版本号展示。设为 true 时自动加时间戳,设为字符串(如 'v1.2.0')则固定追加该值——这决定了用户是否能拿到最新代码。
性能影响明显:开发阶段建议 version: true,避免反复清浏览器缓存;生产环境应设为语义化版本号,配合 CI/CD 自动更新,防止旧 JS 被强缓存。
- 错误写法:
version: '20260316'——看似防缓存,实则每次部署都得手动改,CI 不友好 - 正确做法:构建时注入哈希值,如
version: 'a1b2c3d',确保内容变 URL 就变 - 注意:
version只作用于模块 JS,不影响 CSS 或图片资源
动态修改 config 是危险操作,几乎不该做
layui.config() 设计为“初始化一次”,多次调用不会合并配置,而是完全覆盖前一次——这意味着后续 lay.use() 可能按新 base 去找旧模块,引发路径错乱。
真实需求中,所谓“动态切换环境”(如 dev/staging/prod)应该用构建时变量或 HTML 模板注入,而不是运行时调用 layui.config()。
- 典型反例:在登录成功后根据租户 ID 切换模块路径——这会导致已加载模块的依赖关系断裂,layer、table 等基础模块可能无法正常工作
- 真正需要多环境路径,应在 HTML 中预判:
<script>layui.config({base: window.APP_ENV === 'prod' ? '/p/' : '/d/'})</script> - 如果真遇到不得不改的情况,请确保:1)所有模块尚未加载;2)改完立刻 reload 页面,别试图“热切换”
base 路径末尾那个斜杠,以及 extend 里模块名和文件物理路径的映射关系——它们不出错时毫无存在感,一出错就是整页白屏加控制台静默。











