Layui 3.0.0-alpha 发布,基础开发设施整体升级 🚀
更新:2026/03/03
发布:2025/11/04
先别激动 😬,这不是 Layui 3 的正式版,而是 v3 版本项目结构的一次重要的初始化整理。
📝 更新日志
3.0.0-alpha 版本暂时借助了 v2 既有的组件用于打通 v3 的【🚧 基础开发设施】,因此组件用法与 v2 完全相同。
v3.0.0-alpha.3 2026-03-03
- build: 优化输出文件 iife 改为 umd 方式 #2992 @sentsim
- fix: 修正 laypage.render() 方法返回值错误的问题 #2994 @axguowen
v3.0.0-alpha.2 2026-01-06
- 同步 2.x 多项问题修复 (详见: #2973)
- 优化全局 font-family
v3.0.0-alpha.1 2025-11-16
- 进一步优化基础开发设施
- 消除所有 Lint warnings
- 优化 模块入口文件
- 优化 字体及图标
- 同步
2.13.1 组件
v3.0.0-alpha.0 2025-11-04
- 模块化全面迁移至 ES Module, 放弃 Layui 2 原有的自身轻量级模块系统。
- 基础开发设施由过去单一的 Gulp 打包工具,升级为 Rollup + Babel + PostCSS 的组合式构建流程。
为融入前端更广阔的生态,发行版本提供了三种导入方式:
- 通用 umd 版本(同时兼容 iife + CommonJS + amd)
- 浏览器 esm 版本
- Node 构建环境 esm 版本(支持 tree-shaking)
- 使用 Prettier + ESLint 来统一代码格式和规范,并且我们在「本地开发阶段、git commit 阶段、CI 阶段」都加入了 Code Formatting 和 Linting 的检查,全链路确保代码质量。(后续也可能会考虑直接使用一体化工具链替代,如:Biome)
- 使用 Jest 作为单元测试工具,同时也提供了可视化测试示例页面,多方位提升版本发行的稳定性。
- 开发模式由过去直接导入源码,改为导入 watch 构建后的代码,让调试更贴近生产环境,避免 src / dist 代码表现的差异问题。
- 另外我们还为 Layui 2 既有的组件库添加了 CSS Variable,这意味着重置主题终于变方便了。
- 浏览器兼容采用 browserslist 默认配置,不再支持 IE。
📁 目录结构
https://github.com/layui/layui/issues/2888
🌱 版本意义 🌾
发布 3.0.0-alpha 版本,一方面正式铺开了 Layui 3 的项目主线,接下来只需专注完成新的核心架构、全新功能的组件库。
另一方面也为 Layui 2 组件提供了一个融入现代开发工具的分支,对于喜欢或高度依赖 2.x 的开发者而言,可借助 3.0.0-alpha 的基础设施继续沿着 Layui 2 的组件方向去完善。
⚙️ 使用方式
导入组件
<script src="dist/layui.js"></script>
<script type="module">
const { layer, form, table } = layui;
layer.msg('Hello World');
</script>
<script type="module">
import { layui, lay, layer } from 'dist/layui.esm.js';
layer.msg('Hello World');
</script>
# 安装
npm i layui
import { layui, lay, layer } from 'layui';
layer.msg('Hello World');
全局修改主题
:root,
.light {
/* 默认主题色 */
--lay-color-primary: #16baaa;
--lay-color-accent: #16b777;
}
更多变量参考 src/css/var.css
📄 附