JeecgBoot v3.8.3 低代码实战：从零构建Spring Boot 3 + Vue3业务模块

1. 环境准备与项目初始化第一次接触JeecgBoot时我被它低代码的宣传语吸引但真正让我惊艳的是v3.8.3版本对Spring Boot 3和Java 21的全面支持。记得当时为了测试性能我特意用JDK 21跑了个简单的客户管理模块启动速度比老版本快了近40%。下面我就带你从零开始搭建开发环境。基础环境配置是很多新手容易踩坑的地方。我建议直接安装JDK 21而不是17因为Java 21的虚拟线程特性在处理高并发请求时优势明显。安装完JDK后记得配置JAVA_HOME环境变量这个老生常谈的问题至今仍有30%的初学者会忘记检查。MySQL推荐使用8.0以上版本特别是需要用到JSON字段类型时5.7版本的功能支持有限。获取项目源码时有个小技巧Gitee的仓库通常比Github同步更快。我习惯用这个命令克隆项目git clone https://gitee.com/jeecg/JeecgBoot.git --depth1加上--depth1参数可以只克隆最新提交节省下载时间。解压后注意检查目录结构后端代码在根目录前端代码在ant-design-vue-jeecg子目录这是前后端分离项目的典型结构。2. 数据库与后端服务配置创建数据库时有个细节容易被忽略字符集必须用utf8mb4。去年我帮一个团队排查乱码问题发现他们用的还是老旧的latin1字符集。正确的建库语句应该是CREATE DATABASE jeecg_boot DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;修改application-dev.yml配置文件时建议先备份原始文件。除了基本的数据库连接信息有几个关键参数需要注意spring: redis: database: 0 # 生产环境建议每个模块使用独立db timeout: 3000 # 超时时间单位是毫秒 servlet: multipart: max-file-size: 50MB # 文件上传大小限制启动后端服务时如果使用IDEA记得开启注解处理Annotation Processing。有次我遇到Lombok注解不生效的问题排查两小时才发现是这个选项没勾选。控制台看到Jeecg-Boot startup success后别急着关窗口先访问http://localhost:8080/jeecg-boot/doc.html 确认Swagger文档能正常打开。3. 前端工程配置技巧前端项目启动前建议先清理npm缓存。我遇到过依赖安装失败的情况执行下面命令就能解决npm cache clean --force如果网络不稳定可以永久切换淘宝镜像npm config set registry https://registry.npmmirror.com启动前端服务时npm run serve默认占用3000端口。如果端口冲突可以修改vue.config.js里的devServer配置。有个实用技巧在package.json里添加--open参数能让启动后自动打开浏览器scripts: { serve: vue-cli-service serve --open, }4. 低代码核心功能实战登录系统后第一件事应该是修改默认密码。有次安全测试中我们用扫描工具发现了大量使用默认密码的JeecgBoot系统这是个严重的安全隐患。在线表单开发是低代码的核心。创建客户表示例时字段设计要注意这些细节手机号字段建议用varchar(20)而不是11位数字要考虑国际号码金额字段用decimal(12,2)避免精度丢失每个字段的控件类型决定前端表单样式比如日期选择器、下拉框等同步数据库前务必检查字段注释是否完整。生成的CRUD页面中字段注释会自动转为表单标签。代码生成后下载的zip包后端代码直接放到对应package前端代码需要手动合并路由和api文件。5. 菜单权限配置实战菜单配置有个隐藏功能可以设置按钮级权限。比如在客户管理模块你可以控制哪些角色能看到导出Excel按钮。具体操作是在菜单管理的按钮权限标签页添加权限标识。角色授权时建议采用最小权限原则。我见过一个案例给普通用户授予了系统管理权限导致误删了重要数据。正确的做法是为每个业务模块创建单独的角色比如客户经理、订单管理员等。6. 常见问题排查指南启动时报JDK版本错误检查三处配置pom.xml里的java.versionIDEA的Project Structure系统环境变量JAVA_HOME前端页面空白可能是路由问题尝试清理浏览器缓存或检查vue-router配置。数据库连接超时通常是MySQL的wait_timeout设置过短可以调整为288008小时。性能调优方面我习惯在application.yml中添加这些配置spring: jpa: open-in-view: false # 避免性能陷阱 redis: lettuce: pool: max-active: 20 # 连接池大小根据业务调整7. 进阶开发技巧对于复杂业务逻辑可以在生成的Service类中添加自定义方法。比如客户管理模块需要统计地区分布public MapString, Integer getCustomerDistribution() { return customerMapper.selectList(null).stream() .collect(Collectors.groupingBy( Customer::getRegion, Collectors.summingInt(e - 1) )); }前端二次开发时可以复用JeecgBoot内置的组件。比如使用JDictSelectTag组件快速实现数据字典下拉框j-dict-select-tag v-modelqueryParam.status dictCodecustomer_status placeholder请选择客户状态/项目打包部署时前后端分离部署更利于扩展。后端用mvn clean package生成jar包前端用npm run build生成静态文件。Nginx配置示例location / { root /home/www/jeecg; index index.html; try_files $uri $uri/ /index.html; } location /jeecg-boot { proxy_pass http://127.0.0.1:8080; }