运行Springboot + Vue 项目

news2025/1/10 11:13:07

前言:很多小白拿到java  SpringBoot + Vue前后端分离的项目却不知道怎么运行起来,这里博主就带领小白们一起将项目运行起来吧!

一、环境准备

java后端软件:Idea、jdk、mysql、Navicat(可用其他代替,如dbear等)

vue前端软件:VScode、nodejs

准备好软件之后我们就可以开始了!

二、运行SpringBoot后端

2.1 打开Idea软件,点击Open,选择我们要运行的springboot项目文件目录

2.2 博主这里选择 “springbootxs5o6” 文件夹,点击“OK”,点击使用“Maven project”运行项目;

2.3 导入完成的项目目录为这样,根目录下包含pom.xml依赖包文件;

 2.4 先查看根目录下的pom.xml文件中的java环境是多少,选择对应jdk;我们这里是1.8版本

2.5 配置项目运行环境,点击软件顶部的“File”,然后选择“Project Structure”

2.6 选择 “Project”,然后找到SDK,选择1.8的jdk环境,点击“OK”;

2.7 选择语言版本配置,选择软件头部的“File”,然后选择“Settings”;

2.8 选择“Build Execution Deployment”,然后选择“Compiler”,选择“Java Compiler”,其中“Project bytercode version”选择“Same as language level”或者是根据语言版本选择“8”(1.8就是8),可以看到Module下的文件目录下的版本与语言版本一致1.8,如果不是就手动选择;点击“Apply”,“OK”;

2.9 将pom.xml文件下的sql服务依赖包换成java 8兼容的版本;替换为以下代码段

		<dependency>
			<groupId>com.microsoft.sqlserver</groupId>
			<artifactId>mssql-jdbc</artifactId>
			<version>6.2.0.jre8</version> <!-- 选择与 Java 8 兼容的版本 -->
			<scope>runtime</scope>
		</dependency>

2.10 点击软件右边的“m”图标,然后出来Maven仓库,点击刷新加载,直到依赖包没有爆红为止,如果爆红需要百度一下是什么原因导致的,版本过高还是已经删除此依赖包;

2.11 如果出现爆红的情况,可以点击“Lifecycle”,然后选择“clean”双击,再“install”双击,直到pom.xml文件中不会出现爆红为止;

2.12 到此,可以导入数据库文件了,找到项目目录下的“db.sql”(名字不同,只需找后缀为.sql的文件即可)数据库文件,导入数据库中;

2.13 打开navicat软件,连接你的mysql数据库,小海豚绿色代表连上,鼠标右键,选择运行SQL文件,导入数据库;

2.14 刷新一下,可以看到mysql下面多了一个数据库“springbootxs5o6”;

2.15 回到我们的Idea软件,找到resources--> application.yml文件,打开找到datasource下的mysql配置,更换 driverClassName,直接datasouce换位以下代码,username为mysql数据库的用户名,password为mysql数据库的密码。


    datasource:
        driverClassName: com.mysql.cj.jdbc.Driver
        url: jdbc:mysql://127.0.0.1:3306/springbootxs5o6?useUnicode=true&characterEncoding=utf-8&useJDBCCompliantTimezoneShift=true&useLegacyDatetimeCode=false&serverTimezone=GMT%2B8
        username: root
        password: 123456

2.16 ,我们找到src--> com --> "SrpingbootSchemaApplication"文件,双击;可以看到打开文件之后,软件头部显示“三角形”图标可运行,点击运行即可;

2.17 运行成功,在浏览器中输入,端口号为:8080,访问地址为:http://localhost:8080/springbootxs5o6/front/index.html

即可访问成功!

至此,springboot项目已经运行起来,接下来我们运行vue的后台管理代码吧!

vue后台代码运行请点击:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2215941.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

获取vue实例

需要注意的是&#xff0c;无论通过哪种方式获取元素&#xff0c;如果元素为 vue 组件&#xff0c;则需要在子组件中使用 defineExpose 进行暴露。 在父组件中&#xff0c;我们静态绑定 childRef&#xff1a; 在子组件中&#xff0c;我们需要通过defineExpose函数&#xff0c;手…

05 奶牛与书架

题目&#xff1a; 贪心&#xff1a; #include<bits/stdc.h> using namespace std; #define M 100005 int a[M];bool cmp(int n1,int n2) {return n1>n2; }int main() {int N,B;cin>>N>>B;for(int i1;i<N;i){cin>>a[i];}sort(a1,aN1,cmp);int su…

昆虫分类与检测系统源码分享[一条龙教学YOLOV8标注好的数据集一键训练_70+全套改进创新点发刊_Web前端展示]

昆虫分类与检测系统源码分享 [一条龙教学YOLOV8标注好的数据集一键训练_70全套改进创新点发刊_Web前端展示] 1.研究背景与意义 项目参考AAAI Association for the Advancement of Artificial Intelligence 项目来源AACV Association for the Advancement of Computer Visio…

Electron-(二)桌面应用的启动动画创建

一、概述 在很多桌面应用中都会有启动画面的显示。启动画面可以解决在启动时耗时较长&#xff0c;将每一步反馈给用户。另外一方面解决启动过程中的环境检查及检查结果的反馈。 在当今的桌面应用领域&#xff0c;启动动画已成为提升用户体验的重要组成部分。它不仅仅是一个简单…

使用 Spring 框架构建 MVC 应用程序:初学者教程

Spring Framework 是一个功能强大、功能丰富且设计精良的 Java 平台框架。它提供了一系列编程和配置模型&#xff0c;旨在简化和精简 Java 中健壮且可测试的应用程序的开发过程。 人们常说 Java 太复杂了&#xff0c;构建简单的应用程序需要很长时间。尽管如此&#xff0c;Jav…

Leetcode——数组:滑动窗口209.长度最小的子数组

题目 题解 当需要查找数组中某些连续的数字之和&#xff0c;适合使用滑动窗口 先将滑动窗口的长度设置为0&#xff0c;先将左侧固定&#xff0c;右边界向右移动&#xff0c;同时计算需要找的条件&#xff0c;直到找到可行解为止 当找到可行解后&#xff0c;对其进行优化&…

BUU刷题-Pwn-jarvisoj_typo(ARM符号表恢复技术,Rizzo,FLIRT)

解题所涉知识点&#xff1a; 泄露或修改内存数据&#xff1a; 堆地址&#xff1a;栈地址&#xff1a;libc地址&#xff1a;BSS段地址&#xff1a; 劫持程序执行流程&#xff1a;ARM_ROP 获得shell或flag&#xff1a;调用程序中的system 题目类型&#xff1a; ARM_Pwn arm32 …

Android Framework AMS(04)startActivity分析-1(am启动到ActivityThread启动)

该系列文章总纲链接&#xff1a;专题总纲目录 Android Framework 总纲 本章关键点总结 & 说明&#xff1a; 说明&#xff1a;本章节主要解读AMS通过startActivity启动Activity的整个流程的第一阶段&#xff1a;从am启动到ActivityThread启动。 第二阶段文章链接为&#xf…

如何破解 AI 聊天机器人让它们吐露秘密!窥探 AI 系统指令的 10 种技巧

​ 有时&#xff0c;为了确保 AI 的安全性和透明性&#xff0c;用户需要自己动手&#xff0c;揭开系统指令的面纱。 如果人工智能现在已经成为生活中的事实&#xff0c;并影响着我们的福祉&#xff0c;人们理应知道它的运作原理。 对一些人来说&#xff0c;科幻电影中的经典…

【C++进阶】封装红黑树实现map和set

【C进阶】封装红黑树实现map和set &#x1f955;个人主页&#xff1a;开敲&#x1f349; &#x1f525;所属专栏&#xff1a;C&#x1f96d; &#x1f33c;文章目录&#x1f33c; 1. 源码及框架分析 2. 模拟实现map和set 2.1 实现出复用红黑树的框架&#xff0c;并支持insert…

《TH-OCR:强大的光学字符识别技术》

在当今数字化的时代&#xff0c;高效准确地将纸质文档、图片中的文字转换为可编辑的电子文本至关重要。而 TH-OCR&#xff08;清华 OCR&#xff09;就是一款在光学字符识别领域表现卓越的软件。 一、TH-OCR 的简介 TH-OCR 是由清华大学电子工程系智能图文信息处理研究室研发的光…

Loss:CornerNet: Detecting Objects as Paired Keypoints

目录 3 CornerNet(角点网络)3.1 概述3.2 检测角点3.2.1 检测角点概述3.2.2 训练中的惩罚调整3.2.3 焦点损失变体计算3.2.4 下采样与偏移量预测3.3 角点分组3.3.1 角点分组的需求与启发3.3.2 关联嵌入在角点分组中的应用3.3.3 “拉近”损失和“推开”损失计算3.4 角点池化3.4.…

echarts饼图前后端代码SpringCloud+Vue3

♥️作者&#xff1a;小宋1021 &#x1f935;‍♂️个人主页&#xff1a;小宋1021主页 ♥️坚持分析平时学习到的项目以及学习到的软件开发知识&#xff0c;和大家一起努力呀&#xff01;&#xff01;&#xff01; &#x1f388;&#x1f388;加油&#xff01; 加油&#xff01…

【网络通信基础与实践第五讲】由浅入深了解路由器的结构设计

我们要实现网络互连&#xff0c;需要一个设备&#xff0c;这个设备可以实现将数据从一个端口转发到另外一个端口&#xff0c;从而实现信息的交换&#xff0c;这个设备就是路由器。 知道了路由器的功能需求&#xff0c;我们就要设计对应的结构来满足这样的需求从而实现相应的功…

【数据结构笔记】图Graph

目录 物理结构 邻接矩阵 矩阵压缩 关联矩阵 邻接表 邻接多重表 图搜索 广度优先搜索BFS 边分类 连通域分解 无权最短路径 深度优先搜索DFS 边分类 双连通分量 优先级优先搜索PFS 单源最短路径问题 Dijkstra算法 Bellman-Ford算法 所有结点对最短路径问题 Fl…

Python语言核心12个必知语法细节

1. 变量和数据类型 Python是动态类型的&#xff0c;变量不需要声明类型。 python复制代码 a 10 # 整数 b 3.14 # 浮点数 c "Hello" # 字符串 d [1, 2, 3] # 列表 2. 条件语句 使用if, elif, else进行条件判断。 python复制代码 x 10 if x > 5: print(&q…

获取首日涨停封盘后第二次交易日上涨/下跌的概率

有许多投资者喜欢在股票涨停封盘后&#xff0c;跟进买入。普通股民会认为一个能在今日涨停封盘的股票&#xff0c;证明其上市公司正有十分重大的利好信息&#xff0c;只需要跟进购买便可以获取短期利益。 我们用数据来看一下在当日涨停封盘后&#xff0c;第二次交易日是上涨还…

JavaWeb——Vue:打包部署(Nginx、目录介绍、部署及启动、访问 )

目录 打包 部署 Nginx 目录介绍 部署及启动 访问 前端 Vue 项目的最后一步是打包部署。在当前前后端分离的开发模式中&#xff0c;前端开发人员开发前端代码&#xff0c;后端开发人员开发后端代码。最终要将开发及测试完毕的前端 Vue 代码和后端代码分开部署在对应的服…

pulsar mq 单体验证demo, docker启动pulsar mq验证生产者消费者命令

1. 进入pulsar # 进入容器 docker exec -it xxx /bin/bash # 进入脚本 cd bin 2. 消费命令&#xff1a; ./pulsar-client consume my-topic -s "fist-subscription" 3. 新增一个创建&#xff0c;重复上述操作&#xff0c;进入bin文件夹&#xff0c;输入生产者命令…

JavaSE——集合9:Map接口实现类—HashTable

目录 一、HashTable基本介绍 二、HashTable底层源码解析 1.初始化数组长度为11&#xff0c;临界值为8(0.75*11)&#xff0c;加载因子是0.75 2.对存放的值进行自动装箱 3.执行put方法 4.计算key的hash值 5.计算索引值&#xff0c;放入table数组中 6.插入重复的key会被替…