报修云前端框架是一款采用自身模块规范编写的前端 UI 框架，遵循原生 HTML/CSS/JS 的书写与组织形式，门槛极低，拿来即用。其外在极简，却又不失饱满的内在，体积轻盈，组件丰盈，从核心代码到 API 的每一处细节都经过精心雕琢，非常适合界面的快速开发。她区别于那些基于 MVVM 底层的 UI 框架，却并非逆道而行，而是信奉返璞归真之道。准确地说，她更多是为服务端程序员量身定做，你无需涉足各种前端工具的复杂配置，只需面对浏览器本身，让一切你所需要的元素与交互，从这里信手拈来。
文件结构
├─css //css目录
│ │─modules //模块css目录（一般如果模块相对较大，我们会单独提取，比如下面三个：）
│ │ ├─laydate
│ │ ├─layer
│ │ └─layim
│ └─layui.css //核心样式文件
├─font //字体图标目录
├─images //图片资源目录（目前只有layim和编辑器用到的GIF表情）
│─lay //模块核心目录
│ └─modules //各模块组件
│─layui.js //基础核心库
└─layui.all.js //包含layui.js和所有模块的合并文件
快速上手安装在线报修平台后，将其完整地部署到你的项目目录（或静态资源服务器），你只需要引入下述两个文件：
./layui/css/layui.css
./layui/layui.js //提示：如果是采用非模块化方式（最下面有讲解），此处可换成：./layui/layui.all.js
没错，不用去管其它任何文件。因为他们（比如各模块）都是在最终使用的时候才会自动加载。这是一个基本的入门页面：
如果你想采用非模块化方式（即所有模块一次性加载，尽管我们并不推荐你这么做），你也可以按照下面的方式使用：
//layui模块的定义layui.define([mods], function(exports){
//……
exports('mod', api);});
//layui模块的使用
layui.use(['mod1', 'mod2'], function(args){
var mod = layui.mod1;
//……});
模块化的用法（一般用于开发环境）
我们推荐你遵循的模块规范建立一个入口文件，并通过 layui.use() 方式来加载该入口文件，如下所示：
上述的 index 即为你 /res/js/modules/ 目录下的 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时的模块名一致});
全模块用法（一般用于线上环境）
事实上「模块化加载」十分适用于开发环境，它方便团队开发和代码调试。但对于「线上环境」，我们更推荐您采用「全模块加载」，即直接引入 layui.all.js，它包含了 layui 所有的内置模块，且无需再通过 layui.use() 方法加载模块，直接调用即可。如：
//mod1.js
layui.define('layer', function(exports){
//…
exports(mod1, {});
});
//mod2.js，假设依赖 mod1 和 form
layui.define(['mod1', 'form'], function(exports){
//…
exports(mod2, {});
});
//mod3.js
//…
//main.js 主入口模块
layui.define('mod2', function(exports){
//…
exports('main', {});
});
现在我们可以借助 Gulp 将上述的 mod1、mod2、mod3、main 等扩展模块构建合并到一个模块文件：main，此时你只需要加载它即可：
可以看到，通过「全模块」的用法，我们最多只需要加载两个 JS 文件，这将大幅度减少静态资源的请求。
通过上面的阅读，也许你已经大致了解如何使用了，但真正用于项目远不止如此，你需要继续阅读后面的文档，尤其是「基础说明」。
那么，从现在开始，尽情地拥抱 layui 吧！但愿她能成为你长远的开发伴侣，化作你方寸屏幕前的亿万字节！