How to Set Up and Run RuoYi-Vue 3.1 Locally: A Step‑by‑Step Guide

Overview

RuoYi-Vue is a rapid‑development admin framework built on Spring Boot, Spring Security, MyBatis, Jwt and Vue. The latest separate‑frontend version is 3.1, which adopts a multi‑module Maven layout: ruoyi-ui for the Vue front‑end and ruoyi-admin plus additional modules for the back‑end.

Download and Project Structure

Clone the v3.1 tag from the Gitee repository https://gitee.com/y_project/RuoYi-Vue/tree/v3.1/ or download the zip archive. After extraction the directory contains a sql folder with two SQL files.

Database Setup

Create a local MySQL database named ry-vue310 with charset utf8. Import ry_20200901.sql and then quartz.sql using a client such as Navicat. This creates the required tables and seed data.

Backend Configuration

Open the project in IntelliJ IDEA, locate ruoyi-admin/src/main/resources/application-druid.yml and modify the JDBC URL, username and password to match the local database. Also edit application.yml to set the Redis host, port and password (Redis must be installed locally, e.g., on Windows).

Running the Backend

In IDEA right‑click RuoYiApplication under the ruoyi-admin module and select Run. The server starts on the default port 8080.

Frontend Setup

Open the ruoyi-ui folder in VS Code, open a terminal and run:

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

After dependencies are installed, start the development server:

npm run dev

Accessing the Application

The front‑end defaults to port 80; if that port is occupied it falls back to 81. Open http://localhost:81/ in a browser. Seeing the captcha confirms successful communication with the back‑end. After entering the captcha and logging in, the RuoYi‑Vue admin UI is displayed.