邮宝聊天室项目运行环境配置

本教程仅供 薪火杯组内成员 配置运行环境的教程,不公开项目源码。

邮宝聊天室项目运行环境配置

需要安装的软件

jdk 安装教程

点击打开 jdk 下载页面

点击图片所示位置下载对应版本

jdk下载

下载完成后根据 jdk 安装教程 进行安装。

!!!一定要记住自己的安装路径!!!

配置环境变量 JAVA_HOME 时注意修改成 自己的安装路径

node.js 安装教程

点击打开 node.js 下载页面

一路默认安装即可。

安装完成后,使用 Win + R 打开运行框,输入 cmd 后回车打开命令行,在命令行输入 node -vnpm -v 验证是否安装成功(成功安装会显示版本号,不成功会报错,报错来找我)。

安装完成后,由于仓库默认下载位置在国外,我们要把下载源切换为国内华为源,防止下载过慢甚至出错。

在刚刚打开的命令行中输入命令:

1
npm config set registry https://mirrors.huaweicloud.com/repository/npm/

来设置成华为镜像源。

MySQL 安装教程

点击打开 MySQL 下载页面

点击图片所示位置下载对应版本

MySQL下载

下载完成后根据 MySQL 安装教程 进行安装。

注意:一定要记住自己的设置的数据库密码!!!,建议就为 123456

点击打开 Navicat Premium 17 下载页面

默认安装即可。记住安装路径 后面破解会用到!!!!

点击下载破解补丁

下载完后解压,跟着步骤破解:

  1. 运行一下已经安装的 Navicat 。然后完全退出程序
  2. 双击无限试用 Navicat.bat 脚本
  3. 将 winmm.dll 拖进 navicat 的安装路径下

破解完成后,打开 Navicat ,按下方图示连接你的 MySQL 数据库:

新建连接

输入账号密码

点击确定即可

IDEA 安装教程

点击打开 IDEA 下载页面

选择版本下载

下载完后默认打安装就行

Visual Studio Code 安装教程

点击打开 Visual Studio Code 下载页面

下载完后默认安装就行

配置项目运行环境

下载并解压我在微信群分享的压缩包

配置 MySQL 数据库

打开 Navicat

  1. 右键位置 1 ,打开菜单,新建数据库

新建数据库

  1. 输入数据库名称 cqupt_chat ,调节字符集和排序规则和下图一致,点击确定

调节字符集和排序规则

  1. 双击你刚刚新建的 cqupt_chat 数据库,前面的图标变绿后,再右键它打开菜单,选择 运行 SQL 文件

运行 SQL 文件

  1. 按步骤选择从 我微信发的压缩包 中解压出的 cqupt_chat.sql 文件

PixPin_2024-11-30_19-06-19.png

  1. 修改数据库访问权限,按图示操作

打开命令列

依次输入以下命令(一定要带结尾分号):

1
use mysql;
1
select user,host from user;
1
update user set host='%' where user='root';
1
flush privileges;

运行结果

配置后端 SpringBoot 项目

打开 IDEA

  1. 右上角 File -> Open,选择从 我微信发的压缩包 中解压出的 cqupt_chat 中的 springboot 文件夹打开

  2. 调整 Maven 设置

点击下载 Maven 后,解压到随便一个位置,但是要记住位置,后面要用。

打开设置

  • Maven 主路径 选择刚刚解压的 Maven 文件夹位置。

  • 用户设置文件 勾选 重写 ,然后选择刚刚解压的 Maven 文件夹位置下的 conf 文件夹下的 setting.xml 文件。

调整 Maven 设置

  1. 调整编码

调整编码

  1. 加载 Maven 依赖

开始加载依赖

下载依赖时右下角应该有一个蓝色的进度条,等一段时间依赖下载完成后消失,重新打开 IDEA ,这时 pom.xml 文件应该没有红色字体。

没有红色文字

  1. 配置数据库连接
  • 在 IDEA 中双击打开 springboot/src/main/resources/application.yml 文件

  • 修改 password 为你自己的数据库密码

  • 3 的部分为之前导入的数据库名字 cqupt_chat (默认也是 cqupt_chat )。

PixPin_2024-11-30_23-57-03.png

至此,后端环境配置完成

配置前端 Vue 项目

打开 Visual Studio Code

  1. 找到从 我微信发的压缩包 中解压出的 cqupt_chat 中的 vue 文件夹打开

打开文件夹

打开项目

  1. 在集成终端中(打开方式见下图)按顺序输入
1
npm install -g @vue/cli

等待上一条命令执行结束,输入

1
npm install

这两个命令用来安装依赖,每个命令运行可能都需要一段时间,耐心等待。

安装vue

至此,前端环境配置完成

运行项目

MySQL 数据库运行

Ctrl + Shift + Esc 快捷键打开任务管理器,然后按下图操作(如果已经是正在运行可以忽略)

开启MySQL服务

后端 SpringBoot 项目运行

打开 IDEA

  1. 选择 File -> Open,选择从 我微信发的压缩包 中解压出的 cqupt_chat 中的 springboot 文件夹打开

  2. 双击打开 springboot/src/main/java/com.example/SpringbootApplication 文件, 按下图操作

后端运行

前端 Vue 项目运行

打开 Visual Studio Code

  1. 找到从 我微信发的压缩包 中解压出的 cqupt_chat 中的 vue 文件夹打开

打开项目

启用npm脚本

前端运行

项目启动完毕

大家的账号为 姓名

密码默认 123456

登录后就可以使用了

登录页面

打赏
  • 版权声明: 本博客所有文章除特别声明外,著作权归作者所有。转载请注明出处!
  • Copyrights © 2020-2025 Amano陽菜&丁同勖
  • 访问人数: | 浏览次数:

请我喝杯奶茶吧~

支付宝
微信