idea部署RuoYi-Vue分离版的图文详解_Vue.js

现在大部分公司都使用到了若依框架进行二次开发，相信还有很多小伙伴们对若依不是很了解，ruoyi-vue是一款基于springboot+vue的前后端分离极速后台开发框架，是一个 java ee 企业级快速开发平台，基于经典技术组合（spring boot、spring security、mybatis、jwt、vue），内置模块如：部门管理、角色用户、菜单及按钮授权、数据权限、系统参数、日志管理、代码生成等。在线定时任务配置；支持集群，支持多数据源，支持分布式事务。

想对若依进行更多了解可以传送官方文档： ruoyi

很多小伙伴们还不会部署这个项目到自己的本地，现在我就来教你将ruoyi-vue部署到本地，这里我们以idea进行教程。

话不多说，开干！

准备工作

jdk >= 1.8 （推荐1.8版本）
mysql >= 5.7 （推荐5.7版本）
maven >= 3.0
node >= 12

第一步，拉取项目到我们的idea：

前往gitee下载页面下载解压到工作目录，这里前提，我们需要给idea配置git，然后直接通过链接拉取项目即可。

1.本地下载git，配置到idea中。

在这里插入图片描述

配置好以后，我们就可以通过点击 file -> new -> project from version controller 从远程仓库去获取我们需要的项目，如图：

在这里插入图片描述

2.将gitee路径复制到url框中，设置自定义路径，点击clon就开始加载我们的项目了。

在这里插入图片描述

3.拉取成功就长下面这个样子，如图：

在这里插入图片描述

tips：因为本项目是前后端完全分离的，所以需要前后端都单独部署好，才能进行访问。

第二步，接下来我们准备我们后端启动工作：

必要配置：

修改数据库连接，编辑resources目录下的application-druid.yml

在这里插入图片描述

修改服务器配置，编辑resources目录下的application.yml

在这里插入图片描述

这样基础配置就搞好了，接下来想要启动我们的项目，也要保证我们本地的redis也是在运行着的，所以就需要我们本地有下载好的redis数据库，我们将它运行起来。如果没有也没关系，请传送至官网下载： redis

安装好以后，我们进入redis路径下，双击redis-server.exe文件，如果闪退可以使用管理员运行或者在rides目录下打开黑窗口执行cmd命令：redis-server.exeredis.windows.conf

在这里插入图片描述

rdis启动成功就长下面这个样子，如图：

在这里插入图片描述

reids启动成功，接下来我们就可以启动我们的后端项目了，下面就是后端启动成功的样子，如图：

在这里插入图片描述

第三步，前端部署

首先你需要在本地安装部署nodejs，因为我们接下来都是通过npm命令来进行前端的启动工作。

node.js 安装包及源码下载地址为：node.js

node.js的安装很简单，只要一直下一步就好了，安装好了以后我们开始配置它的环境变量，首先打开我们的环境变量配置（找不到的可以打开搜索框直接搜索环境变量即可），在系统变量中找到path属性，然后将我们的node.js安装路径添加到变量值中，就ok了，如图：

在这里插入图片描述

下一步，我们右键ruoyi-ui(这个就是我们的前端项目)，打开终端，如图：

在这里插入图片描述

下一步，从上往下输入命令，即可

# 安装依赖
npm install

# 强烈建议不要用直接使用 cnpm 安装，会有各种诡异的 bug，可以通过重新指定 registry 来解决 npm 安装速度慢的问题。
# 这里我们使用的是淘宝镜像
npm install --registry= https://registry.npm.taobao.org

# 本地开发 启动项目
npm run dev

最后，我们的若依项目启动成功！

前端启动成功会自动打开浏览器，前端端口号默认80，如图：

在这里插入图片描述