前后端分离项目,后台SpringBoot+前台Vue如何部署在tomcat上?

最新推荐文章于 2024-10-29 11:05:02 发布
原创 最新推荐文章于 2024-10-29 11:05:02 发布 · 2.8k 阅读 · 7 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#java #vue

本文详细介绍了如何将SpringBoot项目打包成WAR文件并部署到Tomcat，同时整合Vue前端静态资源，实现前后端分离的部署方案。具体步骤包括：SpringBoot项目打WAR包、Vue项目打包生成dist文件夹、WAR文件放置于Tomcat webapps目录、创建目录存放前端静态文件及访问配置。
一丶springboot项目打war包

不知道的可以自行百度,或访问如下地址:
链接: https://blog.youkuaiyun.com/spring_is_coming/article/details/103467047.

二丶vue打包会生成dist文件夹,包含如下文件:

在这里插入图片描述

三丶将war文件放到tomcat中的webapps下

在这里插入图片描述

四丶在webapps目录下创建新文件夹(我命名为base,这个随意)存放前台的静态文件

在这里插入图片描述
在这里插入图片描述

五丶运行tomcat,执行访问地址如下:

在这里插入图片描述
base为存放静态文件的目录名,访问会直接跳转到登录页面

这样就访问成功了!!!

前后端分离，将vue+spirngboot 项目部署在tomcat服务器上 优快云
weixin_40819228的博客
10-19 1440
步骤一： 1.vue项目中，在config/prod.env.js中，将其路径(base/看具体项目代码)改为生产环境下的后端端口，保证前端项目能够读取到后端数据。 2.springboot项目中，在pom文件下添加依赖，屏蔽自带的tomcat <dependency> <groupId>org.springframework.boot&lt...
SpringBoot前后端分离项目部署到一个Tomcat下详细（二）后端部署
weixin_41931970的博客
04-21 1188
我这里后端是打包成war包，步骤可以在百度上搜一下。 首先对java后端项目进行修改：下面是pom.xml 移除自带的Tomcat <!-- 添加次jar包，Springboot内嵌Tomcat--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-start
spring boot项目和vue一起放在tomcat部署
11-13
spring boot项目和vue一起放在tomcat部署,spring boot项目和vue一起放在tomcat部署
SpringBoot+Vue前后端分离项目部署到Tomcat
他好像条狗啊的博客
02-25 1万+
SpringBoot+Vue前后端分离项目部署到Tomcat 因为项目更新原因，此次有机会正式部署项目到服务器中，特此记录一下 前端项目打包 1. 打包之前，需要将前端配置文件Index.js里端口号改为8080，pathRewrite里面参数设置为要发布的项目名称 2. 将接口url前缀开头改为与配置文件相同 3. 开始打包工作，在前端项目文件夹打开命令窗口，打包命令 4. 输入命令 n...
前后端分离的项目部署到tomcat_springboot+vue前后端分离，nginx代理配置 tomcat 部署war包详细配置...
weixin_39805851的博客
12-21 750
1.做一个小系统，使用了springboot+vue 基础框架参考这哥们的，直接拿过来用，链接https://github.com/smallsnail-wh/interest前期的开发环境搭建就不说了，太多了，自己找吧。2.发布部署将开发好的前端vue代码 执行 npm run build 默认会生成dist文件夹(里面都是一些js文件)+index.html文件，留着后面备用nginxngin...
精选资源
Java项目:在线商城系统(前后端分离+java+vue+Springboot+ssm+mysql+maven+redis)
03-27
本系统功能包括： 前台展示+后台管理，包括最基本的用户登录注册，下单， 购物车，购买，结算，订单查询，收货地址，后台商品管 理，订单管理，用户管理等等功能，小伙伴一起来看看 吧。 二、项目运行 环境配置： ...
精选资源
Java项目:网上电商项目(前后端分离+java+vue+Springboot+ssm+mysql+maven+redis)
12-06
本系统功能包括： 一款基于Springboot+Vue的电商项目，前后端分离项目，前台后台都有，前台商品展示购买，购物车分类，订 单查询等等，后台商品管理，订单管理，信息维护，用户管理等等。本期源码免费，部分bug小辰...
精选资源
SpringBoot + Vue + ElementUI 实现一个后台管理系统模板.zip
02-22
在本项目中，我们利用SpringBoot、Vue.js和ElementUI这三个强大的技术栈，构建了一个功能完善的后台管理系统模板。下面将详细解析每个组件及其在系统开发中的应用。 首先，SpringBoot是基于Spring框架的一个轻量级...
宝塔面板+阿里云部署springboot+vue项目
暴力扬
08-12 3680
详细介绍自己部署springboot+vue项目的经历，使用宝塔面板+阿里云centos部署，介绍了如何安装宝塔，如何用宝塔安装必须环境，配置数据库，打包vue，springboot，以及云服务器安全组需要放行的端口号，项目部署中出现的问题...
如何在本地部署vue+springboot前后端分离应用
Gyoung杨广
12-16 1万+
如何在本地部署vue+springboot前后端分离应用
tomcat部署springboot+vue.doc
04-22
web项目是企业以及政府部门最常用的工具，政府门户网站，企业官网等基本都是web项目，web项目所使用的技术也是在不断的更新，前几年的技术基本上都是jsp+ssh，到后来的h5+ssh，h5+spring+mybatis，目前使用最多的是springboot+VUE前后端分离的技术，本文主要介绍了springboot+VUE怎么使用tomcat去部署
springboot+vue项目部署在tomcat上
weixin_47902184的博客
11-03 2883
has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header contains multiple values，项目部署tomcat
tomcat同时部署springboot(idea)项目和vue项目(webstorm)
lisen01070107的博客
01-02 3199
tomcat同时部署springboot(idea)项目和vue项目(webstorm) 1 后台项目打包 1.1 打包后台springboot的项目 选择File->Project Structure 然后根据下图所示 选择 Artifacts 右键Add一个 Web Application Archive 然后应用 ok 1.2 选择 Build --> build Artifa...
springboot + vue前后端分离项目的部署
weixin_43807679的博客
12-17 282
一.先编译前端项目 在idea里 npm install npm run build 生成一个dist文件夹 2.将dist文件夹上传到服务器 3.配置Nginx 将 /usr/local/nginx/conf下的nginx.conf配置 1 . location /{ root /opt/ui-workspace/dist; index index.html index.htm; } 修改头部 user root; 访问ip地址80端口（记得开放80端口） 静态资源可以加载 二.后端部署 spr
Springboot+Vue前后端分离项目的部署
m0_67265654的博客
03-08 936
Springboot+Vue前后端分离项目的部署 项目介绍 项目部署准备 后端部署 数据上传 前端部署 开放端口 总结 项目介绍 本项目是基于springboot+vue的前后端分离的，数据库用的是MongoDB，前端用了vue+echarts，这也是我一个假期的学习成果吧。 项目部署准备 本项目最终是运行在云服务器上的，所以先做一些部署前的准备。（我所列出的软件并非必须，你也可以使用其他软件） 需要用到的软件： Navicat Premium：开发的时候是在自己电脑上开发的，所以数据都在自
springBoot+vue前后端分离项目部署
m0_45029597的博客
10-06 564
前端项目采用tomcat部署 下载tomcat，这里我是用的是tomcat8，下载好后解压，这里就不具体写了，个人觉得这个写出来有点侮辱智商了，解压后进入webapps，删除原有的文件夹，然后将前端打好的dist文件夹放到这里，修改tomcat的配置文件server.xml修改端口，修改好之后进入bin目录启动tomcat 后端项目启动： 本地打好jar包，上传到服务器，与前端的tomcat在同一文件路径下，个人建议tomcat解压后改个名字（例如myFront），这里的logs文件夹里面放的是我的项目的
Spring boot 和 Vue 前后端分离项目的启动部署（详细版）
热门推荐
weixin_40331613的博客
08-01 11万+
一、首先拿到spring boot + vue项目，可以从git 上获取到 spring boot 项目导入idea中启动，运行mian函数启动项目（tomcat端口改为80） 二、安装node（最新版）https://nodejs.org/en/download/（具体安装过程，查百度） 测试node和cpm是否成功 打开黑窗口（win键+x）点击:命令提示符管理员（必须以管理员运行）。 ...
SpringBoot项目打成war和vue项目部署到tomcat中的实现
最新发布
aliqingge的博客
10-29 827
最近做了一个xxx项目，前后端分离架构，后端还集成thymeleaf，主要用于实现门户网站的功能，不想集成到vue里面，前端项目部署也不想使用NGINX做代理，增加资源的浪费，就想有没有办法把vue的项目集成SpringBoot来，网上也看了一些案列，但是操作起来都会出现各种各样的问题，于是自己折腾了下，用war的方式实现，和大家分享一下，仅供参考，希望对大家有用。
Vue项目打包到Spring Boot后部署Tomcat
sensen的博客
10-10 5667
经过几天的调试，终于将vue+springboot的前后端分离项目，整合后成功部署到服务器。本文章来记录一下这几天遇到的问题。整合后发布到Tomcat遇到的主要问题：访问项目路径404；发布到tomcat后css、js等资源文件404问题；访问项目路径为空白页
环保网站前后端分离实践：SpringBoot+Vue技术方案
本项目采用了当前流行的前后端分离架构，以及在业界广泛使用的技术栈，包括SpringBoot框架、Vue前端框架、ElementUI组件库等。具体技术知识点如下： 1. SpringBoot框架: - SpringBoot框架是本项目后端开发的核心，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值