1. 项目结构

springbootu298c503/
├── frontend/                # Vue 前端项目
├── src/
│   └── main/
│       ├── java/            # Spring Boot 后端代码
│       └── resources/
│           ├── static/      # 前端打包后的静态资源
│           └── application.yml
└── pom.xml

2. 前端（Vue）打包

1. 进入前端目录：

   cd frontend

2. 安装依赖（如未安装）：

   npm install

3. 配置 vue.config.js，确保 publicPath 为根路径：

   module.exports = {
     publicPath: '/'
   }

4. 打包前端：

   npm run build

5. 打包完成后，将 frontend/dist 目录下的所有内容（不是整个 dist 文件夹，而是里面的内容）拷贝到后端的 src/main/resources/static/ 目录下。

   src/main/resources/static/index.html
   src/main/resources/static/js/...
   src/main/resources/static/css/...
   src/main/resources/static/fonts/...

3. 后端（Spring Boot）配置

1. 去掉 context-path 前缀 编辑 src/main/resources/application.yml，确保没有 context-path 配置：

   server:
     port: 8080

2. 静态资源映射 Spring Boot 默认会将 static 目录下的内容作为静态资源对外暴露，无需额外配置。

3. WebMvcConfig（如有） 如果你有前端路由（如 history 模式），可用如下 fallback 方案：

   @Configuration
   public class WebMvcConfig implements WebMvcConfigurer {
       @Override
       public void addResourceHandlers(ResourceHandlerRegistry registry) {
           registry.addResourceHandler("/upload/**")
                   .addResourceLocations("file:./upload/");
           registry.addResourceHandler("/**")
                   .addResourceLocations("classpath:/static/")
                   .resourceChain(true)
                   .addResolver(new PathResourceResolver() {
                       @Override
                       protected Resource getResource(String resourcePath, Resource location) throws IOException {
                           Resource requestedResource = location.createRelative(resourcePath);
                           return requestedResource.exists() && requestedResource.isReadable() ? requestedResource
                                   : new ClassPathResource("/static/index.html");
                       }
                   });
       }
   }

4. 不要再有 IndexController 避免和静态资源冲突。

4. 前端 API 请求路径

• 所有 API 路径直接用 /api/xxx、/auth/login 等根路径，不需要加任何前缀。

• 建议在 request.js 里统一配置 baseURL 为 / 或空字符串。

5. 启动与访问

1. 重启 Spring Boot 项目，确保新配置生效。

2. 访问地址为：

   http://localhost:8080/

3. 前端页面和后端接口都能正常访问。

6. 常见问题与细节

• 静态资源必须直接放在 static 目录下，不要有多余的 dist 子目录。

• 前端 history 路由模式，必须有 fallback 方案（如 WebMvcConfig），否则刷新页面会 404。

• 接口 404 问题，多半是 context-path 配置或前端路径未统一。

• 跨域问题，前后端同部署不会有跨域，开发环境可用代理解决。

• 强制刷新浏览器缓存，每次部署新前端建议 Ctrl+F5。

7. 生产环境建议

• 可用 Nginx 代理静态资源和接口，提升性能与安全。

• 数据库、端口等敏感配置用环境变量或外部配置管理。

• 日志、异常、权限等做好监控和处理。

如有特殊需求或遇到问题，欢迎随时补充！