需引入 jquery 1.8+ 并使用官方独立版 layer.js（无 layui.define），删除 layer.css 和示例文件；webpack 需配置 externals 或用 gulp 合并 jquery 与 layer.js 为单文件，html 中 script 引入后调用 layer.msg() 验证。
要在不引入完整 Layui 框架的前提下，仅将 layer 弹出层作为独立组件打包进项目，需跳过 layui.use 机制，直接依赖 jQuery 并构建 layer 的最小运行环境。
确认 layer 独立运行前提
layer 独立使用时【必须引入 jQuery 1.8+ 版本】，且不能依赖 layui.js 或 layui.css；官方已将样式内联进 layer.js，无需额外加载 CSS 文件。
这一步漏掉 jQuery 或版本低于 1.8，layer.msg()、layer.open() 等调用会直接报错 Uncaught ReferenceError: $ is not defined。
下载并精简 layer 独立包
访问 https://layer.layui.com → 点击「独立版下载」→ 解压得到 layer.js 和 layer.css（实际可删）。
打开 layer.js 文件，搜索 /* layui.define */，确认全文无该字符串——有则说明是模块化版本，不可用于独立场景；【必须用独立版 layer.js，非 layui 源码中的 src/modules/layer.js】。
删除解压包中所有 .html 示例文件和 demo 目录，只保留 layer.js —— 这是唯一必需文件。
配置构建脚本实现自动打包
方法一：Webpack 中显式 externals 排除 layui
在 webpack.config.js 的 externals 字段添加：externals: { 'layui': 'layui', 'jquery': 'jQuery' }，然后在入口 JS 中 import layer from './lib/layer.js'；但注意 layer.js 本身不支持 ES Module，需配合 script-loader 或设置 type: "module" 的 script 标签动态注入。
方法二：Gulp 打包合并（推荐）
① 创建 gulpfile.js，安装 gulp 和 gulp-concat：npm install --save-dev gulp gulp-concat；
② 在 gulpfile.js 中定义 task：
const gulp = require('gulp');<br>const concat = require('gulp-concat');<br>gulp.task('pack-layer', () => {<br> return gulp.src(['./src/jquery.min.js', './src/layer.js'])<br> .pipe(concat('vendor.layer.min.js'))<br> .pipe(gulp.dest('./dist/js/'));<br>});
③ 运行 gulp pack-layer，生成 vendor.layer.min.js —— 此文件已按执行顺序合并 jQuery 与 layer，可直接 script 引入使用。
在 HTML 中验证引入效果
在页面底部写入：
<script src="./dist/js/vendor.layer.min.js"></script><br><script>layer.msg('加载成功');</script>
浏览器打开后弹出提示即表示独立打包成功。若控制台报 layer is not defined，请检查 script 标签是否在 DOM 加载完成后执行，或确认 vendor.layer.min.js 是否含语法错误。
