vue3+springboot项目部署tomcat

### Vue3 和 Spring Boot 项目部署至 Tomcat 教程 #### 排除内置 Tomcat 的依赖项 为了确保外部 Tomcat 正常工作而不与内嵌版本发生冲突，在 `pom.xml` 文件中应调整依赖范围，将 `spring-boot-starter-tomcat` 设置为 provided 类型。这可以避免打包后的应用程序与外置容器中的 JAR 包产生冲突。 ```xml <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-tomcat</artifactId> <scope>provided</scope> </dependency> ``` 此操作有助于防止因重复加载相同库而导致的应用程序无法正常启动的问题[^1]。 #### 构建并优化前端工程 对于基于 Vue.js 开发的单页面应用 (SPA)，完成开发测试阶段后需通过命令行工具将其编译成静态资源文件以便于集成到 Java Web 应用之中： ```bash npm run build ``` 该指令会依据配置生成一系列用于生产环境的 HTML/CSS/JavaScript 资源，默认情况下会被放置在一个名为 dist 的目录下[^2]。 #### 修改 Spring Boot 工程结构适配 WAR 打包模式 为了让 Spring Boot 支持以 WAR 形式部署到传统 Servlet 容器如 Apache Tomcat 上运行，除了上述提到更改 Maven POM 中关于 Tomcat 的设置之外，还需做几处改动： - 将项目的打包方式由默认的 jar 更改为 war； - 继承自 `SpringBootServletInitializer` 并重写 configure 方法来支持独立 webapp 初始化逻辑； - 把前端构建产物复制粘贴进 src/main/resources/static 下面作为公共资源访问路径的一部分。 #### 解决常见问题 当尝试访问已发布的站点却遭遇 HTTP 404 错误时，通常是因为 URL 映射不匹配或是静态资源位置不对所引起的。确认 application.properties 或 yml 文件里是否有正确的上下文根定义以及检查是否正确设置了欢迎页控制器[@ControllerAdvice] 来处理未命中请求返回 index.html 页面从而实现路由回退机制。 另外需要注意的是，如果之前已经在代码层面实现了 CORS（跨域资源共享），则无需再额外修改 Tomcat 配置以免引起不必要的麻烦[^3]。 #### 自动化部署流程建议 考虑到实际运维场景可能涉及频繁更新迭代的需求，推荐采用 CI/CD 流水线配合脚本自动化整个过程，比如利用 Jenkins/GitLab CI 等平台触发事件后自动拉取最新代码、执行 npm install 及 vue-cli-service 命令进行前端编译、调用 mvn clean package 对后端服务实施增量构建最后借助 SCP/SFTP 方式传输最终制品到目标主机指定位置并通过 systemctl restart tomcat9.service 实现平滑重启[^4]。