前后端分离springBoot项目集成部署vue

已于 2023-10-19 09:23:38 修改
阅读量171 收藏
点赞数
文章标签： spring boot vue.js 后端
于 2023-10-19 09:21:45 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_31255557/article/details/133919217
版权

springboot项目

创建默认项目即可

vue项目

在springboot项目中使用npm init vue@latest脚手架创建vue项目,其他方式创建项目也可以
自己npm添加依赖,例如element-plus

集成部署

build vue项目生成dist中的静态资源,放到resources/static中,打包部署jar包即可

访问测试

直接访问springboot端口号
http://localhost:8306即可访问index.html

注意

不要把index.html放到template下,这个是给thymeleaf使用的放入html

lskisme
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
【项目部署实战】-服务器宝塔部署SpringBoot项目和Vue项目并设置代理
gjb760662328的博客
04-18 2828
上传vue打包好的dist目录下的文件（static+index.html）因为后端运行在9010端口，所以需要腾讯云平台防火墙策略通过9010端口。采用的腾讯云-轻量云服务器-2G 2核 40GBSSD+ 宝塔镜像。上传SpringBoot打包好的jar包。当请求接口时发现，前端的代理策略不生效。
如何快速搭建自己的阿里云服务器（宝塔）并且部署springboot+vue项目（全网最全）
Java&Develop的博客
01-14 7635
对于新手或者学生党来说，有时候就想租一个云服务器来玩玩或者练练手，duck不必花那么多钱去租个服务器。这些云服务厂商对学生和新手还是相当友好的。下面将教你如何快速搭建自己的阿里云服务器，完成云服务器的部署。
Spring + vue 项目部署(全网最详细教程_含内网穿透部署)
你长的真帅大佬，不妨动动小手点赞加关注
09-17 4935
本项目以Springboot 2.7.11和vue2做参考示例本项目以Springboot 2.7.11和vue2做参考示例展示前后端代码的成品前端Vue后端Java项目写完后，差不多就是这个样子，仅供参考！前端打包的方式有以下几种：方法1:#直接打包，简单明了，这个会在你的项目里面出现一个dist的打包文件方法2：#选择打包路径，可以指定你打包的路径方法3：#使用IDEA开发工具进行打包后端打包安装成功后就会多出以下目录这个就是后端打包的jar包。
搭建SpringBoot+Vue框架
zd15690912965的博客
10-08 8407
自己学习框架做项目
springboot引入vue项目的教程
勤修方可得道成仙
10-24 1322
将 Vue 项目引入到 Spring Boot 中有多种方法，其中一种方法是使用 Spring Boot 的静态文件服务。你可以将 Vue 项目的静态文件（html、js、css）复制到 Spring Boot 的静态文件目录下（默认路径为 /src/main/resources/static）。这样，你就可以在 Spring Boot 中直接访问 Vue 项目的静态文件了。你可以将 Vue 项目作为独立的模块引入到 Spring Boot 中，然后使用 DevTools 来调试和运行两个模块。
前后端分离：springboot+vue
01-22
总的来说，这个项目展示了如何利用SpringBoot和Vue.js实现高效、分离的Web应用开发，是学习和实践前后端分离技术的好材料。开发者可以通过研究该项目，深入了解这两者的整合方式，提升自己的全栈开发能力。
vue+springboot前后端分离项目源码
10-09
项目源码"journey前后端项目"包含整个系统的前端和后端代码，包括Vue.js组件、SpringBoot微服务模块、Redis配置、Druid数据源设置以及RabbitMQ相关配置和处理器。开发者可以通过查看和学习这些源码，深入了解如何将...
springboot3+ vue3前后端分离项目搭建代码
04-05
总的来说，"springboot3+ vue3前后端分离项目搭建代码"是一个全面展示现代Web开发技术的实例，涵盖了后端服务、前端界面、以及二者之间的协作。对于想要学习或深入理解Spring Boot和Vue 3的开发者来说，这是一个极好...
影视评论系统Springboot+Vue（前后端分离）
06-16
总结，这个"影视评论系统Springboot+Vue（前后端分离）"项目提供了完整的前后端代码，适用于学习和实战。开发者可以通过阅读源码，了解Springboot与Vue.js结合的实践方式，以及如何构建一个完整的前后端分离应用。...
SpringBoot-Vue前后端-分离人事项目
04-30
【SpringBoot-Vue前后端分离人事项目】是一个典型的企业级应用示例，它结合了SpringBoot后端框架和Vue.js前端框架，实现了高效、现代化的人事管理系统。在本项目中，SpringBoot作为后端处理业务逻辑，提供RESTful ...
SpringBoot+Vue项目部署（传统方式）
weixin_44924882的博客
04-09 5829
虽然项目打包后用jar包里的配置文件也可以启动，但是推荐将配置文件提取出来，一般开发环境和生产环境的配置是不一样的，通过加载外部配置文件的方式启动，更便于维护配置信息，这里生成一个web-server.yml的配置文件，里面是项目的配置信息，可以根据项目实际需要生成。为了方便，有时候我们会连接本地的MySQL数据库，数据库安装成功后默认远程连接是关闭的，3306端口也是不对外开发的，需要做如下配置。项目在本地可以正常启动，这是因为本地有安装JDK，数据库等，若想要项目在服务器上也能正常启动，则同样需要。
SpringBoot前后端分离项目在服务器上的部署过程详解
Young_深情不及里子的博客
12-09 3763
闲暇之余，抽空对前后端分离项目在服务器上的部署过程做个大致梳理.仅作为一个简单学习笔记之用。欢迎大佬提出自己的放发见解。
5分钟搞定 Springboot + Vue前后端分离项目部署
qq_41243828的博客
12-22 684
访问Node.js官网（https://nodejs.org/）下载并安装适合你操作系统的Node.js版本。在Spring Boot项目的src/main/resources目录下创建一个名为static的文件夹，并将第4步生成的静态资源文件复制到该文件夹中。现在，你的Spring Boot + Vue项目已经部署成功，可以通过浏览器访问http://服务器IP地址：端口号来查看项目。将生成的target目录下的my-vue-app-0.0.1-SNAPSHOT.jar文件上传到服务器。
【前后端分离项目部署】关于“vue3+SpringBoot+阿里云服务器+宝塔操作”的打包部署全流程配置
m0_60935824的博客
10-19 1560
npm run 命令dist。
前后端分离项目的部署（springBoot + vue）
m0_52598382的博客
01-04 933
4.后端代码使用package打包，打包前注意修改mysql的连接地址因为localhost部署完是找不到的换成自己运行mysql镜像的ip。3.在blog下创建一个文件夹html用于存放前端打包后的dist文件夹中的内容拷贝到html中（全部内容）1.使用docker安装对应后台代码的mysql、redis、jdk等。2.新建一个文件夹blog（名称随意，位置随意）5.将jar包上传到服务器的blog文件夹下面。6.编写Dockerfile。
vue+springboot前后端分离项目整合部署流程
haohulala的博客
05-30 5005
我们在进行前后端分离开发的时候，一般是将前端项目部署到nginx服务器上，与后端项目分开部署，但是如果是个人开发的小型项目，不需要这么麻烦，直接将前后端项目放到一起部署即可。本文就来介绍一下前后端项目一起部署的流程。
SpringBoot前后端分离项目，打包、部署到服务器详细图文流程_springboot前后端分离项目怎么部署
最新发布
m0_61331573的博客
04-06 1157
为了做好运维面试路上的助攻手，特整理了上百道。
SpringBoot前后端分离项目实战部署
怕什么真理无穷，进一寸有一寸的欢喜。即使开了一辆老掉牙的破车，只要在前行就好，偶尔吹点小风，这就是幸
04-20 5658
部署简介 本项目是一个前后端分离项目，前端使用vue和elementUI，后端是springBoot集成redis、mysql。项目中的静态资源直接上传到服务器磁盘，使用nginx做动静分离。 部署实战 1：服务器项目环境搭建 首先保证服务器的Java环境是正常的。 安装redis，设置密码。 安装MySQL，将本地的数据生成sql脚本，利用脚本同步本地的MySQL数据。 安装nginx 将项目用到的接口打开，让外网能够访问。 2：前后端项目的资源打包上传 后端项目打包：这里要注意几个问.
Spring Boot与Vue前后端分离实战教程
"该资源是关于《Spring Boot Vue前后端分离开发实战》的PDF文档，适合初学者，内容详实易懂。文档中提到了如何使用Spring Boot与Vue.js进行前后端分离的开发，以及相关的工具和配置。" 在本文档中，作者详细介绍了...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值