参考： https://www.layui.com/doc/
安装
下载并解压后放在静态资源文件夹下
引入
1.模块化加载
使用layui.js表示先加载要用的，其他按需加载。layui.css比全模块加载时使用的layui.all.js小很多，更适合开发环境，便于快速调试。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>开始使用layui</title>
<link rel="stylesheet" href="layui/css/layui.css">
</head>
<body>
<!-- 你的HTML代码 -->
<script src="layui/layui.js"></script>
<script>
//一般直接写在一个js文件中
layui.use(['layer', 'form'], function(){
var layer = layui.layer
,form = layui.form;
layer.msg('Hello World');
});
</script>
</body>
</html>
可以拆写成：
文档结构：其中test.html是主页面，与layui文件夹和js文件夹同层。
a.主页面写：
<script src="layui/layui.js"></script>
<script>
layui.config({
base: './js/' // 这里是存放新模块的目录。注意这个点号
}).use('index'); // 加载入口
</script>
b. /js/index.js中写：
/**
项目JS主入口
以依赖layui的layer和form模块为例
**/
layui.define(['layer', 'form'], function(exports){
var layer = layui.layer
,form = layui.form;
layer.msg('Hello World');
exports('index', {
}); //注意，这里是模块输出的核心，模块名必须和use时的模块名一致
});
2.非模块化加载
即所有模块一次性加载。
a.改一个文件名：
b.把
<script>
//一般直接写在一个js文件中
;!function(){
var layer = layui.layer
,form = layui.form;
layer.msg('Hello World');
}();
</script>
如果项目中存放了多个扩展模块（可以简单理解为一个js文件就是一个模块），那么只需要根据其依赖关系将其合并，即可一次性加载所有扩展模块。比如把多个模块合并为main，然后加载main即可。
<script src="../layui/layui.all.js"></script>
<script>
layui.config({
base: '../js/' //你的扩展模块所在目录
}).use('main'); //这里的 main 模块包含了 mod1、mod2、mod3 等等扩展模块
}();
</script>
springboot
<link rel="stylesheet" href="/layui/css/layui.css">