vue+springboot项目上传部署tomcat

最新推荐文章于 2025-03-12 18:01:55 发布
最新推荐文章于 2025-03-12 18:01:55 发布
阅读量871 收藏 12
点赞数 8
文章标签： spring boot tomcat 后端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/PCthedream/article/details/135408676
版权
本文详细介绍了如何将Vue前端项目和SpringBoot后端项目部署到Tomcat服务器。首先，下载并安装Tomcat，配置环境，然后启动Tomcat进行测试。接着，前端使用npm run build打包，后端通过SpringBootServletInitializer配置并修改pom.xml排除内置Tomcat冲突。最后，将打包后的war文件放入Tomcat的webapps目录下，并配置管理界面的账号密码。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

下载及安装Tomcat

进入tomcat官网，Tomcat官网
选择需要下载的版本，点击下载
下载路径一定要记住，并且路径中尽量不要有中文

下载后是压缩包 .zip，解压后

tomcat系统各个文件夹目录是什么意义：
bin：放置的是Tomcat一些相关的命令，启动的命令（startup）

最低0.47元/天 解锁文章
PCthedream
关注
vue项目部署到Tomcat方法
高贵的程序媛
01-10 1975
将 Vue 项目部署到 Tomcat 的方法 1. Vue项目路由配置 项目上线，一般需要添加项目名，并且消去vue-router产生的#号，需要在router的配置下，在本项目是router->index.js下配置： import Vue from "vue"; import Router from "vue-router"; Vue.use(Router); export defau...
vue+springBoot前后端分离项目，tomcat部署记录
Certainly_的博客
08-14 521
tomcat部署vue+springBoot前后端分离项目
tomcat部署vue项目（成功版）
热门推荐
凤舞九天的博客
12-01 1万+
1、tomcat介绍 2、下载tomcat 3、启动tomcat 4、打包vue项目 5、tomcat部署vue项目 1、tomcat简介 tomcat 是免费的web服务器。不使用tomcat也可以打开html页面，但是可以在浏览器的地址里看到file:d:/test.html这样的格式，是通过打开本地文件的形式打开的。使用tomcat后，可以这样127.0.0.1:8080/test.html像访问一个网站似的，访问一个html文件了。 2、下载tomcat https:/...
tomcat部署springboot+vue（不使用nginx）
最新发布
qq_37559701的博客
03-12 315
避免tomcat下部署多个项目，出现org.springframework.jmx.export.UnableToRegisterMBeanException:影响项目启动。例如：localhost:8080，访问的是前端项目，对应的localhost:8080/safe（.env.production文件中的地址）就是后端接口地址。首先将.env.production文件中的后端接口路径改为tomcat下war包部署后的访问地址，然后运行以下命令进行打包。打包完成后，生成dist文件夹。
Vue部署项目到tomcat中
Wzp的博客
01-11 699
这是在vue.config.js中的配置 module.exports = { //webapp下的gis文件夹（自己创建的） publicPath: "/gis/", devServer: { port: 8082, open: true, // proxyTable: { // "/api": { // //这里最好有一个 / // target:
Vue项目部署到tomcat服务器
qq_45791192的博客
10-19 264
Vue项目部署到tomcat服务器 转载地址：https://www.jb51.net/article/141742.htm
Vue前端项目部署在tomcat
My note
07-21 3708
修改路由配置src/router/index.js，增加配置base‘/Vue/’，如果这里不配置，会导致部署的项目首页访问一片空白，但不报错，且引入的文件有正常加载。执行npmrunbuild，将打包生成的dist目录下的所有东西粘贴到Tomcat/webapps/路径下新建一个Vue文件夹，Vue是自定义的项目名，访问路径格式>>ipport/Vue，例如http//localhost8080/Vue/，即可访问到Vue项目。前端项目中使用到了代码。...
vue3+springboot打包部署到本地tomcat
weixin_44550198的博客
04-13 1296
一：vue3打包 1.首先在router/index.js里修修改mode和base 2.接着是vue.config.js 3.最后在终端执行打包语句npm run build，打包成功显示如下图 4.在项目目录下会生成一个fbp-account-fe文件然后把该文件复制放到tomcat下的webapps里。 二：打包springboot 1.首先是打vue打包出来的文件放到springboot项目的static文件夹里 2.在项目的启动类里继承SpringBootServletInitial
springboot+vue项目部署在tomcat上
weixin_47902184的博客
11-03 2777
has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header contains multiple values，项目部署tomcat
基于SpringBoot+Vue的springboot电影推荐系统（包括源码、数据库、部署说明）.zip
05-31
SpringBoot 项目，下载下来，简单部署，就可以使用。 包含：项目源码、数据库脚本、软件工具等，前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷，具有很高的实际应用价值。 项目...
Vue项目webpack打包部署到Tomcat
fyinthesky的专栏
03-01 2262
Vue项目webpack打包部署到Tomcat 转自 https://www.jianshu.com/p/911f66d4d6f6 Vue项目webpack打包部署到Tomcat 新建Vue项目webpack打包，部署到Linux服务器Tomcat上。 2，在Linux服务器下的Tomcat的webapps下创建VueTest文件夹， 3，配置router/index.js文件，增加b...
spring boot项目和vue一起放在tomcat部署
11-13
spring boot项目和vue一起放在tomcat部署,spring boot项目和vue一起放在tomcat部署
Vue项目打包部署到Tomcat
weixin_54351962的博客
09-10 8313
一. 思路 使用 npm run build命令打包完成之后，会出现一个dist文件夹，里面有static文件夹和一个index.html文件，如果我们要部署在tomcat上面，即需要将dist文件放在tomcat里的webapps文件夹下，再用docker执行下重启指令，然后在本地起的vue项目就可以通过链接外部访问了。别人访问你本地的vue项目就不需要通过你的ip地址，在同一网段下才能访问了。 二. 步骤 1.在vue项目的vue.config.js文件中module.exports导出的对象中添加 p
vue项目打包部署到tomcat服务器
木兮兰兮
04-29 1万+
总结： 修改vue项目相关配置，cmd进入到vue项目文件夹中，执行npm run bulid命令，将生成的dist文件夹下的内容，存放到Tomcat中的webapps新建文件夹下，运行Tomcat服务器，通过IP地址:端口\新建文件夹名称【http://192.168.10.127:8080/jkpt/】，即可访问vue项目。 步骤一：修改vue项目相关配置 （1）在vue.config.js文件中module.exports导出的对象中添加 publicPath: ‘./’ 的配置项。 （.
【tomcat】部署vue项目
lorogy的博客
07-17 1394
vue项目打包为dist 在tomcat的webapps下新建文件夹，比如myvue 将dist内的index.html和static上传到myvue目录下 浏览器输入http://[ip]:[port]/myvue即可访问
Tomcat上部署vue项目（详细）包括安装，配置vue的history模式刷新404问题
Zhangwei557的博客
06-03 2751
2、解压tomcat文件,可以通过快捷键(command+shift+G)把它放入/Library(资源库中)在 Tomcat 下 webapps→test（test项目文件名）→创建WEB-INF→创建web.xml。6、npm run build后生成dist文件，放到tomcat中webapps中，以labo为例。5、开启Tomcat，终端输入sudo sh ./startup.sh，输完回车。至此两个问题解决完成！4、授权bin目录下的所有操作：终端输入。3、在bin目录下打开终端。
vue3项目打包部署到Tomcat（亲测有效）
jolinoy的博客
12-21 8185
1.在vue项目的vue.config.js文件里面module.exports导出的对象中添加 publicPath: ‘./’ 的配置项。2.在vue项目中的router文件夹下index.js添加配置项 base: ‘/文件夹名称/’ （文件夹名称可自己随意设置）5.在地址栏里面输入:localhost:8080看到如下页面，说明Tomcat安装正确。首先，要确保电脑上已经安装了jdk，还有Tomcat，而且都安装正确。如果要改端口的话，可以查看：本文顶部的Tomcat 9.0安装及配置。
关于部署vue项目在Linux上的两种方式tomcat以及nignx（1）使用tomcat进行部署
阿丹的博客
05-24 4097
阿丹有话说： 之前在写spring-boot项目的时候是直接写的jsp页面直接打成war包来运行。使用到了tomcat,而且简单方便，但是美中不足就是动画演示以及页面没有办法做的非常美观。自从开始写前后端分离的项目（微服务等）之后，发现element-ui是真的好用。现在想给vue的项目打包部署在自己的服务器上的时候发现了一些不一样。经过两天的学习以及摸爬滚打 ，学到了一些心得。给大家总结出来一个文章。方便大家，也想让大家少走一些弯路（和我一样）。
tomcat部署前端vue项目（项目上线具体操作）
qq_45349018的博客
02-16 8398
前端Vue项目上线部署操作。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值