本地环境vue与springboot联调

方案1: 前后端分离

1. 启动Springboot服务
2. 配置vue代理(前端项目根目录下的vue.config.js)，转发API请求到后端服务

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({transpileDependencies: true,devServer: {proxy: {'/api': {target: 'http://localhost:2025', // Spring Boot 服务地址changeOrigin: true, // 支持跨域// pathRewrite: {//   '^/api': '', // 根据实际需求调整路径重写规则// },},},},
})

3. 启动vue服务

方案2:前后端不分离

1. 为Spring配置静态资源路径，指向vue项目的编译结果文件夹

-Dspring.resources.static-locations=classpath:/static/,file:/path/to/static/

2. 如果使用的是较新的 Spring Boot 版本（如 2.4+）

spring的默认路径为："classpath:/META-INF/resources/","classpath:/resources/","classpath:/static/","classpath:/public/"
-Dspring.web.resources.static-locations=file:/absolute/path/to/static/dist/

3. Spring中配置所有非API请求转发到vue的index页面

@Controller
public class IndexController {/*** desc @RequestMapping("/{path:[^\\.]*}")：将非 API 的请求路径转发到 index.html。* 前提是你的 index.html 文件在 src/main/resources/static 或其他静态资源目录下。* @return :*/@RequestMapping("/{path:[^\\.]*}")public String forwardToIndex() {return "forward:/index.html";}
}

4. 启动Springboot项目