准备工作
layui 是一套经典的前端 UI 框架，安装并不依赖 Node.js 或构建工具。你只需要准备一个能运行静态页面的环境，比如直接用浏览器打开 HTML 文件，或在本地起一个简单服务器。
获取 layui 有两种常用方式：
- 官网下载发行包，解压后得到
layui目录； - 通过 CDN 直接引用，省去本地文件管理。
方式一：本地引入
把解压后的 layui 文件夹放到项目根目录，结构如下：
project/
├─ layui/
│ ├─ css/
│ ├─ layui.js
│ └─ font/
└─ index.html
在 index.html 的 中引入 CSS，在 前引入 JS：
注意路径大小写和层级。如果 layui 目录与 HTML 不在同一级，需要按实际相对路径调整，否则会出现样式丢失或图标不显示。
方式二：CDN 引入
不想下载文件时，可直接使用公共 CDN：
CDN 方式适合快速验证和演示，但生产环境建议锁定版本号，避免上游更新导致兼容问题。
初始化与模块加载
引入 layui.js 后，通过 layui.use 加载所需模块：
layui.use([‘layer’, ‘form’], function(){
var layer = layui.layer;
var form = layui.form;
layer.msg(‘layui 已就绪’);
});
layui.use 的第一个参数是模块名数组，第二个是回调函数。回调里通过 layui.模块名 取到模块对象。只加载用到的模块，能减少不必要的请求。
页面模板基础结构
一个最小可用的 layui 页面通常包含布局容器和组件标记：
layui-container 提供固定宽度居中布局，layui-btn 是按钮样式类。组件行为由 JS 模块驱动，样式类只负责外观。
常见问题排查
样式不生效
检查 CSS 路径是否正确，浏览器开发者工具的 Network 面板能看到 404 请求。确认 layui.css 与 font 目录在一起，字体文件缺失会导致图标显示为方块。
模块加载失败
如果控制台提示模块未找到，确认 layui.js 已正确引入，且 layui.use 中的模块名拼写无误。模块名区分大小写。
与 jQuery 共存
layui 内置了自己的模块系统，不强制依赖 jQuery。如果项目同时使用 jQuery，注意加载顺序，避免 $ 被覆盖。
小结
layui 模板安装的核心就是两件事：正确引入 layui.css 和 layui.js，然后按需加载模块。本地引入适合可控的离线项目，CDN 适合快速起步。跑通第一个 layer.msg 弹窗后，再逐步替换成表格、表单等复杂组件即可。
