ruoyi(若依)框架使用说明(前后端分离)

最新推荐文章于 2024-11-10 17:33:18 发布

as-鲨鱼辣椒

最新推荐文章于 2024-11-10 17:33:18 发布

阅读量6.6w

点赞数 40

文章标签： java 代码规范编辑器

本文链接：https://blog.csdn.net/weixin_47534571/article/details/109303741

版权

RuoYi是一个基于Vue和Spring Boot的后台管理系统框架，提供代码生成器，能根据数据库表自动生成前后端代码，简化开发流程。启动包括克隆源码、执行SQL、配置数据库、运行前后端。通过代码生成示范，展示了如何快速生成并植入代码。该框架还有系统监控、定时任务和接口文档管理等功能，适用于快速开发。

摘要由CSDN通过智能技术生成

@TOC

框架介绍

本身是一个优秀的简单的后台管理系统框架,前端(Vue,ElementUI),后端(Spring Boot、Spring Security、Redis & Jwt),本身可以直接拉下来直接使用.它的强大之处在于代码自动生成器的使用,可以根据数据库的表对应生成全套前后端代码,代码植入后可以直接使用,复杂业务只需在基础代码上进行修改增强即可.减少了重复代码的编写,提高了开发效率.

详情请访问:https://gitee.com/y_project/RuoYi-Vue

框架启动步骤

一.克隆源码到本地

git clone https://gitee.com/y_project/RuoYi-Vue.git

二.执行sql

执行RuoYi-Vue/sql文件夹下的sql,将数据导入到mysql数据库

三.后端系统运行

将项目导入idea,修改ruoyi-admin模块yml文件里面DataSource:mysql信息和redis信息
mvn install
运行RuoYiApplication

四.前端系统运行

进入RuoYi-Vue/ruoyi-iu文件夹
shift+鼠标右键打开powershell窗口(或者打开cmd窗口)
npm install (前提是电脑上安装了node.js)
npm run dev
浏览器访问 http://localhost:80

代码生成示范

在数据库中建立goods表
讲goods表导入
编辑导入表信息

在这里插入图片描述

代码生成及植入
1. 执行sql
2. cv大法,将前后端代码复制进相应文件夹
3. 前端 npm install 然后 npm run dev
4. 后端重启
效果展示

在这里插入图片描述

前端访问后端接口IP地址设置

配置前端访问后端接口ip地址:编辑/ruoyi-ui/vue.config.js文件内的tartget属性

proxy: {
      // detail: https://cli.vuejs.org/config/#devserver-proxy
      [process.env.VUE_APP_BASE_API]: {
        target: `http://localhost:8089`,
        changeOrigin: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_BASE_API]: ''
        }
      }
    }