基于Layui的开源后端管理应用模板——KitAdmin

开源技术
904
0
0
2022-04-13

介绍

layui是国内开发者开发的一个面向所有层次的前后端开发者,零门槛开箱即用的前端UI解决方案,可以说它极度符合国人的风格,深受广大前后端开发者和爱好者的喜爱,也诞生了不少基于layui的框架模板,特别适合国内前中后端工程师使用,KITADMIN就是其中一个基于layui的后端管理应用模板,当前版本是基于layui 2.x重构的版本,与之后1.x版本有本质有区别。该版本的核心是[路由],不再支持[iframe]方式的加载,可以说更加的优雅了!

基于Layui的开源后端管理应用模板——KitAdmin

开源地址

码云:

https://gitee.com/kitteam/kit_admin/

演示地址:

http://kit.zhengjinfan.cn/#/

版本特性

以下是来自demo页面作者的介绍,感兴趣的可以直接去看看

  • 1、用法一如既往的简单,快捷。(只需要简单的配置就实现一些功能).
  • 2、提供本地开发环境。(依赖nodejs运行环境和gulp)
  • 3、提供代码功能。(依赖nodejs运行环境和gulp)
  • 4、模块化加载。(依赖layui模块化,用法与layui保持一致)
  • 5、提供路由功能。(路由是本版本的核心功能了,需与模板绑定,详情请参考相关文档)
  • 6、完全的前后端分离开发。(集成mockjs用于拦截请求并返回模拟数据,详情请参考相关文档)
  • 7、左侧菜单重写,支持到4级菜单。(集成mockjs用于拦截请求并返回模拟数据,详情请参考相关文档)

文档就在demo页面的下面.

基于Layui的开源后端管理应用模板——KitAdmin

脚手架

KITADMIN的作者非常给力,提供了开箱即用的脚手架,我们可以基于此脚手架直接用于正式开发

https://gitee.com/kitteam/kit_admin_scaffold/
  1. 提供本地开发环境;
  2. 提供代码打包功能 ;
  3. 模块化;
  4. 提供路由功能;
  5. 能快速开发单页面应用程序。

基于Layui的开源后端管理应用模板——KitAdmin

打开后效果:

基于Layui的开源后端管理应用模板——KitAdmin

页面都是以模板形式的,如下

基于Layui的开源后端管理应用模板——KitAdmin

开发构建:

# 安装node依赖包
npm install
# 启动开发环境 http://localhost:8010
npm start
# 构建生产环境代码
npm run build
PS:这个地方需要注意的是,你nodejs的版本不能过高,我在本地测试时发现最高版本12.x会报错,随后重新安装了nodejs10,问题随之解决!

效果预览

在正式选用框架之前,你应该大致的预览一下,以免开发的时候才发现可能无法满足你的需求:

  • 登录页面

基于Layui的开源后端管理应用模板——KitAdmin

  • 左侧菜单栏

菜单栏支持多级菜单,最多支持4级,支持收缩菜单栏

基于Layui的开源后端管理应用模板——KitAdmin

  • 顶部(看不清可以直接打开Demo预览)

基于Layui的开源后端管理应用模板——KitAdmin

  • 页面设置:

你可以切换页面模式,可以使选项卡式,也可以是单个页面模式(一次只打开一个页面),更换主题功能


基于Layui的开源后端管理应用模板——KitAdmin

  • 选项卡模式

基于Layui的开源后端管理应用模板——KitAdmin

  • 切换主题

基于Layui的开源后端管理应用模板——KitAdmin

  • 页签管理

基于Layui的开源后端管理应用模板——KitAdmin

  • 左侧边栏打开

基于Layui的开源后端管理应用模板——KitAdmin

  • 右侧边栏

基于Layui的开源后端管理应用模板——KitAdmin

兼容性

KIADMIN很遗憾不兼容IE,但是当前大多数新项目已经不再要求兼容IE了,一些特殊的项目除外,因此也并不是问题,支持其他主流的浏览器

关于layui

关于layui,笔者一直都在关注,因为当时的毕业设计就用了它,因此感触很多,在之前的一段时间里,layui停止更新了一段时间,但最近作者又在疯狂的更新了,虽然现在还是2.x版本,但是我相信在未来不久的日子里,3.0版本会上线的,大家可以去官网随时查看相关动态!

基于Layui的开源后端管理应用模板——KitAdmin

总结

KITADMIN是一个不错的后端应用的前端模板,虽然可能和官方的layuiAdmin相比还稍逊一筹,但是它是开源的,对于个人开发者尤为友好,如果你对它感兴趣,不妨可以试试,如果是企业用户,无论是使用KITADMIN还是使用官方的layuiAdmin都是可以的,如果你遇到了什么困难,这里我引用作者的一句话:

多思考,多动手,进步是可以看得见的!