将vue3项目打包后部署在springboot项目运行图文教程

// vite.config.ts
export default defineConfig({
    plugins: [vue()],
    base:'/', // 设置项目的基础路径
    resolve:{
        alias: [
            {
                find: '@',
                replacement: path.resolve(__dirname, 'src')
            }
        ]
    },
    server: {
        host: '0.0.0.0',
        proxy: {
            '/api': {
                target: 'http://localhost:8080', // 设置代理目标
                changeOrigin: true,
                rewrite: (path) => path.replace(/^/api/, '')
            }
        }
    }

})

// package.json
"scripts": {
    "dev": "vite --open",
    "build": "vue-tsc --noEmit && vite build",
    "preview": "vite preview"
  }

spring:
        web:
            resources:
                static-locations: classpath:/static/

// pom.xml
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

// BasicController.java
@Controller
public class BasicController {
    // http://127.0.0.1:8080/
    @RequestMapping("/")
    public String html(){
        return "index";
    }

}

// BasicController.java
@Controller
public class BasicController {
    // http://127.0.0.1:8080/
    @RequestMapping("/")
    public String html(){
        return "index";
    }
    // 捕获所有未匹配路径并重定向到 index.html
    @GetMapping("/**/{path:[^\.]*}") // 不匹配带"."的路径（如 .js/.css 等静态资源）
    public String redirect() {
        return "forward:/";
    }
}