springboot+vue项目部署在tomcat上

本文档详细介绍了如何将一个使用Vue.js(vue-element-admin框架)的前端项目与Spring Boot后端整合,并部署到Tomcat服务器。首先,前端打包dist文件放入Tomcat的webapps目录下,然后修改vue.config.js的publicPath。接着,打包后端项目,调整启动类并进行打包生成war文件。最后,将war文件复制到Tomcat的webapps目录,启动Tomcat并访问项目。注意,如果有跨域配置,不要在Tomcat中重复设置,否则会导致错误。

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

从前端下手,我用的是vue-element-admin框架
//打包命令
npm run build:prod
随后会打包出dist文件,把这文件复制粘贴到tomcat的webapps路径下面

在这里插入图片描述

启动tomcat后访问dist路径 localhost:8080/dist/ ,如果页面出现空白,可以把vue.config.js配置文件里的publicPath值改一下,斜杠前面加个 “.” 。

在这里插入图片描述

接下来打包后端,先加载一些依赖
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent<
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值