【RuoYi-Vue】搭建RuoYi-Vue开发环境

RuoYi是一个很棒的开源SpringBoot的脚手架管理系统,记录学习过程。

我这里搭建的是RuoYi-Vue前后端分离版,

官网地址是:https://doc.ruoyi.vip/ruoyi-vue/

 

1、安装后台项目依赖

  1. 安装:JDK 8+,并设置好环境变量
  2. 安装:Intellij IDEA(或Eclipse)
  3. 安装:Maven 3.3.9+,并设置好阿里云的镜像地址:

在C:\Program Files\apache-maven-3.3.9\conf\settings.xml中,修改mirrors如下:

  
    
      mirrorId
      repositoryId
      Human Readable Name for this Mirror.
      http://my.repository.com/repo/path
    
    
    
        alimaven1
        Nexus aliyun
        https://maven.aliyun.com/repository/central
        central
    
    
    
        alimaven2
        aliyun maven
        http://maven.aliyun.com/nexus/content/groups/public/
        central
    
    
    
        alimaven3
        aliyun maven
        http://maven.aliyun.com/nexus/content/repositories/central/
        central
    
    
    
        repo1
        Human Readable Name for this Mirror.
        http://repo1.maven.org/maven2/
        central
    
    
    
        repo2
        Human Readable Name for this Mirror.
        http://repo2.maven.org/maven2/
        central
    
  

 

2、安装前端项目依赖

安装:Node.js(已自带npm)

 

3、安装数据库

安装MySQL数据库(略)

安装Redis数据库(略)

 

4、下载RuoYi-Vue源码

在Gitee上下载源码:https://gitee.com/y_project/RuoYi-Vue

然后,解压放到某个目录下(eg:D:\JavaApp\)

 

5、部署MySQL数据库

在MySQL中,执行以下脚本创建一个新的MySQL数据库:

CREATE DATABASE `ry-vue` 
CHARACTER SET 'utf8mb4' 
COLLATE 'utf8mb4_unicode_ci'
;

然后找到项目工程下的mysql初始化脚本:

RuoYi-Vue\sql\quartz.sql

RuoYi-Vue\sql\ry_20200920.sql

然后在新建的ry-vue库中,执行这2个脚本即可。

 

碰到的坑:如果是MySQL5.6,可能会报错:Index column size too large. The maximum column size is 767 bytes. (1709) (SQLExecDirectW)')

解决方法如下:

在quartz.sql文件中添加2句设置,然后在每个表都改成ROW_FORMAT=DYNAMIC,然后重新执行。

【RuoYi-Vue】搭建RuoYi-Vue开发环境_第1张图片

 

6、部署后台工程

    1. 用Intellij IDEA打开RuoYi-Vue项目,并刷新Maven依赖

    2.新建文件上传目录: D:/ruoyi/uploadPath

【RuoYi-Vue】搭建RuoYi-Vue开发环境_第2张图片

    3.修改Redis连接信息

【RuoYi-Vue】搭建RuoYi-Vue开发环境_第3张图片

    4.修改MySQL连接信息

【RuoYi-Vue】搭建RuoYi-Vue开发环境_第4张图片

    5.启动后台服务

【RuoYi-Vue】搭建RuoYi-Vue开发环境_第5张图片

 

控制台打印以下内容,说明后台服务启动成功:

【RuoYi-Vue】搭建RuoYi-Vue开发环境_第6张图片

 

7、部署前端工程

在D:\JavaApp\RuoYi-Vue>目录下执行以下命令:

cd ruoyi-ui

npm install --registry=https://registry.npm.taobao.org

npm run dev

打印出来这些信息,说明前端工程已经启动成功

【RuoYi-Vue】搭建RuoYi-Vue开发环境_第7张图片

 

8、打开浏览器,登陆网页

地址:http://localhost:80

默认帐号:admin/admin123

【RuoYi-Vue】搭建RuoYi-Vue开发环境_第8张图片

你可能感兴趣的:(RuoYi,web)