一、前置准备
前端代码：front-end
后端代码：back-end
官方文档：RuoYi-Vue-Plus
二、启动后端服务
配置 maven，jdk。
设置 ⟶ 构建、执行、部署 ⟶ 构建工具 ⟶ Maven ⟶ 配置
用户设置文件和本地仓库项目结构 ⟶ 项目设置 ⟶ 项目 ⟶ SDK
修改配置文件
ruoyi-admin/src/main/resources/application.yml# 多租户配置 tenant: # 是否开启 enable: false配置 mysql 和 redis 连接
ruoyi-admin/src/main/resources/application-dev.yml（1）配置主库数据源的 数据库名称（默认是ry-vue），账号，密码
# 主库数据源 master: type: ${spring.datasource.type} driverClassName: com.mysql.cj.jdbc.Driver # jdbc 所有参数配置参考 https://lionli.blog.csdn.net/article/details/122018562 # rewriteBatchedStatements=true 批处理优化 大幅提升批量插入更新删除性能(对数据库有性能损耗 使用批量操作应考虑性能问题) url: jdbc:mysql://localhost:3306/ry-vue?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8&autoReconnect=true&rewriteBatchedStatements=true&allowPublicKeyRetrieval=true&nullCatalogMeansCurrent=true username: root password: 123456（2）配置redis：若没有密码则注释密码那一行
--- # redis 单机配置(单机与集群只能开启一个另一个需要注释掉) spring.data: redis: # 地址 host: localhost # 端口，默认为6379 port: 6379 # 数据库索引 database: 0 # redis 密码必须配置 # password: ruoyi123 # 连接超时时间 timeout: 10s # 是否开启ssl ssl.enabled: false创建数据库
（1）新建数据库
数据库名：ry-vue 字符集：utf8mb4 排序规则：utf8mb4_general_ci（2）导入数据库：将
script/sql文件夹中的ry_vue_5.X.sql,ry_workflow.sql,ry_job.sql三个sql文件依次导入数据库。启动后端项目（确保 mysql 和 redis 在后台运行）
Maven：选择配置文件为dev ⟶ 重新加载 Maven ⟶ 确保 Maven 的依赖下载完成
项目启动：将运行配置改为DromaraApplication ⟶ 运行项目 ⟶ RuoYi-Vue-Plus启动成功
三、启动前端服务
npm i # 安装依赖
npm run dev # 运行项目
# (♥◠‿◠)ﾉﾞ RuoYi-Vue-Plus启动成功 ლ(´ڡ`ლ)ﾞ
# 默认管理员账号：admin
# 默认管理员密码：admin123四、新增业务
新增目录
进入网页 ⟶ 侧边栏 ⟶ 系统管理 ⟶ 菜单管理 ⟶ 新增 ⟶ 新增完成请刷新页面
上级菜单：主类目 菜单类型：目录 菜单图标：自定义（可以在前端'front-end/src/assets/icons/svg'文件夹中添加需要的svg图标） 菜单名称：测试目录（自定义） 显示排序：1（目录在侧边栏的显示顺序） 是否外链：否（选择是外链则路由地址需要以'http(s)://'开头） 路由地址：test（访问的路由地址） 显示状态：显示（选择隐藏则路由将不会出现在侧边栏，但仍然可以访问） 菜单状态：正常（选择停用则路由将不会出现在侧边栏，也不能被访问）新增菜单（若需要使用代码生成则跳过此步）
进入网页 ⟶ 侧边栏 ⟶ 系统管理 ⟶ 菜单管理 ⟶ 新增 ⟶ 新增完成请刷新页面
上级菜单：测试目录 菜单类型：菜单 菜单图标：自定义 菜单名称：测试菜单 显示排序：1 是否外链：否 路由地址：testMenu 组件路径：test/testMenu/index（访问的组件路径，默认在'views'目录下） 权限字符：选填（控制器中定义的权限字符） 路由参数：选填（访问路由的默认传递参数） 是否缓存：缓存（选择是则会被'keep-alive'，需要匹配组件的'name'和地址保持一致） 显示状态：显示 菜单状态：正常创建数据表
（1）数据库新建表
表名（目录_菜单），字段名 按照下划线命名规范，务必填写对应的注释。
（2）默认字段建议
默认字段 建议全部填写上去，若依会通过MybatisPlus帮助其自动填充。
CREATE TABLE `` ( `_id` varchar(50) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NOT NULL COMMENT 'ID', `del_flag` int DEFAULT '0' COMMENT '删除标志（0存在，2删除）', `create_time` datetime DEFAULT NULL COMMENT '创建时间', `create_by` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL COMMENT '创建人', `create_dept` bigint DEFAULT NULL COMMENT '创建部门', `update_time` datetime DEFAULT NULL COMMENT '更新时间', `update_by` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL COMMENT '更新人', `tenant_id` varchar(20) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL COMMENT '租户ID', PRIMARY KEY (`_id`) USING BTREE ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci ROW_FORMAT=DYNAMIC COMMENT='表';创建模块
（1）后端 ⟶ ruoyi-modules ⟶ 新建 ⟶ 新模块
名称：ruoyi-test 语言：Java 构建系统：Maven JDK：与构建系统时的版本保持一致 父项：ruoyi-modules # 高级设置 组 ID：org.dromara 工件 ID：ruoyi-test（2）引入模块依赖
ruoyi-admin/pom.xml<!-- 测试模块 --> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-test</artifactId> </dependency>（3）引入模块依赖
/pom.xml<!-- 测试模块 --> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-test</artifactId> <version>${revision}</version> </dependency>（4）重新加载 Maven
代码生成
（1）导入数据表
进入网页 ⟶ 侧边栏 ⟶ 系统工具 ⟶ 代码生成 ⟶ 导入 ⟶ 勾选数据表
（2）编辑数据表
基本信息：
# 可以保持不变 表名称：test_testMenu 实体类名称：TestTestMenu 表描述：测试菜单 作者：Marimo_z 备注：( •̀ ω •́ )y字段信息：
字段描述：生成表单后的字段名 插入：列表新增数据时显示 编辑：列表编辑数据时显示 列表：列表上显示 查询：允许通过该字段查询 显示类型：根据需求调整 字典类型：关联字典值，适用于选择框（例：性别），需要提前在字典管理中创建字典。 # 字典设置：侧边栏 ⟶ 系统管理 ⟶ 字典管理 ⟶ 新增 ⟶ 字典类型 ⟶ 管理字典生成信息：
生成模板：单表（增删改查） 生成包路径：org.dromara.test 生成模块名：test 生成业务名：testMenu 生成功能名：测试菜单 上级菜单：测试目录 生成代码方式：zip压缩包（3）下载对应代码并解压 ⟶ 放入对应的位置
main # 后端代码 vue/ # 前端代码 ├── api/ # API请求代码 │ ├── test/ ├── views/ # 页面代码 ├── test/ testMenu.sql # sql文件（4）后端新模块配置
将需要的工具包导入
<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <parent> <groupId>org.dromara</groupId> <artifactId>ruoyi-modules</artifactId> <version>${revision}</version> </parent> <artifactId>ruoyi-test</artifactId> <description> test测试菜单模块 </description> <properties> <maven.compiler.source>17</maven.compiler.source> <maven.compiler.target>17</maven.compiler.target> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> </properties> <dependencies> <!-- 通用工具 核心包--> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-common-core</artifactId> </dependency> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-common-doc</artifactId> </dependency> <!--mybatis orm包--> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-common-mybatis</artifactId> </dependency> <!--translation--> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-common-translation</artifactId> </dependency> <!--mvc--> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-common-web</artifactId> </dependency> <!-- excel--> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-common-excel</artifactId> </dependency> <!--日志输出--> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-common-log</artifactId> </dependency> <!--校验认证--> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-common-idempotent</artifactId> </dependency> <dependency> <groupId>org.dromara</groupId> <artifactId>ruoyi-common-tenant</artifactId> </dependency> </dependencies> </project>关闭后端项目 ⟶ 找到刚才导入模块的main中的controller层，将爆红处需要的类导入
重新加载 Maven ⟶ 重启后端项目
（5）进入网页 ⟶ 找到刚刚创建的菜单 ⟶ 测试功能（增删改查）
![PC端和H5端适配 [Vue3]](https://blogs.marimo.fun/usr/themes/Joe/assets/thumb/32.jpg)
![校验注解 [Spring Boot]](https://blogs.marimo.fun/usr/themes/Joe/assets/thumb/38.jpg)
评论 (2)