前言

项目doc address: RuoYi-Vue-Plus

本系列使用的环境版本:

• 后端:RuoYi-Vue-Plus: v5.1.2
• 前端:RuoYi-Vue-Plus的对应版本RuoYi-Vue-Plus 5.1.2(注意版本号)
• Windows 11 22H2

Ⅰ.后端项目本地搭建

查看文档可知,后端项目需要一个数据库 和 redis,因为是Windows环境,数据库和redis选择最终如下:

• mysql 5.7 (docker-desktop安装,参考文章)
• zkteco-home/redis-windows,直接clone项目后 用管理员权限执行 install_redis.cmd即可开启reids服务.该组件我下载的版本为 7.2.4

• jdk: 文档要求使用openjdk-17/21 或 graalvm-community-jdk-17/21 版本,本系列文章使用 openjdk-17
• maven: 文档 3.8.X ,本系列使用 3.9.X

1. 获取源码 : git clone https://gitee.com/dromara/RuoYi-Vue-Plus.git
2. 基础环境建设: 确认mysql 数据库 和 redis服务能连接正常,工作正常
3. idea 文档强调使用 idea 2022 2024 (一定不要使用2023后果自负),这里选择2022版本,下载idea 2022 后 用其打开后端源码
4. mysql 建库建表:MySQL创建数据库ry-vue (可以去ruoyi-admin的application-dev.yml查到),依次执行 RuoYi-Vue-Plus/script/sql 目录下的sql脚本 : ry_vue_5.X.sql,test.sql,powerjob.sql (不同数据库请自行选择 script下的文件夹)
5. . 由于5.X项目maven默认为 jdk17,所以主pom.xml中的java版本无需改动,修改jdk参考 文档 init
6. 修改配置,改为自己的数据库连接属性,本地这里先配的主库数据源即可正常启动项目

编辑 RuoYi-Vue-Plus\ruoyi-admin\src\main\resources\application-dev.yml

---

# 主库数据源
url: jdbc:mysql://localhost:3306/ry-vue?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8&autoReconnect=true&rewriteBatchedStatements=true
username: root
password: 12345678

编辑RuoYi-Vue-Plus\ruoyi-extend\ruoyi-powerjob-server\src\main\resources\application-dev.properties

---

sspring.datasource.core.jdbc-url=jdbc:mysql://localhost:3306/ry-vue?useUnicode=true&characterEncoding=UTF-8&serverTimezone=Asia/Shanghai&allowPublicKeyRetrieval=true
spring.datasource.core.username=root
spring.datasource.core.password=12345678

7. 启动服务:需优先启动 MonitorAdminApplication 与 PowerJobServerApplication ,最后启动 主服务 DromaraApplication.前两者非必须,这里本地开发先只启动DromaraApplication 验证基础功能
8. 观察控制台日志,启动成功日志会打印出

“(♥◠‿◠)ﾉﾞ RuoYi-Vue-Plus启动成功 ლ(´ڡ`ლ)ﾞ”

2.前端项目启动

提前安装

• nodejs 18(18以上未测试 不建议使用)
• npm 8.X (7.X确认有问题)

1. 获取源码: git clone https://gitee.com/JavaLionLi/plus-ui.git ,
2. 在源码的根目录下,启动终端
3. 安装依赖 npm install --registry=https://registry.npm.taobao.org
4. 启动开发环境 npm run dev
5. 前端访问地址 http://localhost:80
   如果你的系统端口被占用 去.env.development 文件下修改 VITE_APP_PORT 的值