前言
jeecg-boot是一款优秀的开发框架。
已经集成了开发中常用的基础功能,比如代码生成、权限隔离、前后端分离、组织人员职位管理、角色管理、数据字典等。
前端也做了组件化的设计,也封装了诸多常用组件,这些封装也为后来的开发者提供了多样的参考素材。
本着学习和分享的理念,这里分享我的一些心得体会
官网地址:http://www.jeecg.com/
hello-jeecg
下载源码
后端:https://github.com/jeecgboot/jeecg-boot
前端:https://github.com/jeecgboot/jeecgboot-vue3
编译和启动-后端
后端:后端是常见的springCloud/springBoot项目,熟悉的朋友应该上手就能使用。为了快速上手,我这里使用单体应用的模式(如果使用微服务模式,官方文档有说明)
启动类和配置文件都在jeecg-system-start这个模块
正常启动后,日志输出:
编译和启动-前端
前端框架主要是Vue3、antdv(Ant Design Vue)
官方文档写得很详细(具体看项目里的README.md)。这里说一下我遇到的问题
文档里使用的是pnpm,安装命令:
npm install pnpm -g
初始化项目
pnpm install
启动
pnpm serve
当然, 使用原来常用的命令似乎也可以:
# 初始化
npm install
#启动
npm run dev
#打包
npm run build
部分电脑识别不到pnpm命令
检查终端是Windows PowerShell,还是传统的"windows命令提示符"
如果是powerShell,可以参考这篇:
如果是windows命令提示符,请检查环境变量配置
登录
各项功能都可点击查看和使用。大部分都能找到源码,为将来的业务功能开发提供参考素材。
代码生成使用
jeecg-boot提供了方便的代码生成功能。可以在这里通过【新增】创建新表,也可以通过【导入数据库表】将已有的表导进来。
勾选需要生成代码的表,点击【代码生成】可生成代码。
生成的代码已实现基本的增删改查功能。我尝试过单表、单表(树),体验都还不错。
这里要注意“包名(小写)”。
比如,我这里写的是test,那么生成后的包是:org.jeecg.modules.test
在test下面,再有controller、entity、mapper、service各个包
前端代码在Vue3目录
生成后的代码
把生成的代码放入系统
后端:把整个test包拷入后端需要的路径,vue3目录不需要复制。重启服务
前端:将前面的vue3目录拷贝到下图的views目录,然后改成对应的模块名,比如test。修改后,前端服务会自动更新。如果没有更新,手动重启
菜单配置、授权
菜单功能比较完善,常见的业务场景基本都能支撑
这里要注意“访问路径”和“前端组件”
访问路径: 前浏览器地址栏显示的访问路径。你可以随便填一个,不和原有路径重复就行
前端组件: 组件的实际路径,要准确填写。前面代码生成的实体名是EExam,包是test。那这里的前端组件要填:test/EExamList
保存。然后在角色管理进行菜单授权。刷新页面后,可以看到新配置的菜单,可以进行简单的CRUD操作