最近想用vue集成一个spirngboot项目。于是百度了一下,大部分教程都是搭建前端vue项目,然后将生成的dist目录下的文件复制到resources下的static,但是按照上面的教程,项目无法正常访问启动后。摸索了一段时间,总结如下,先看集成目录结构,再看具体教程步骤编译前端工程修改config/index.jsbuild中的build模块配置:{//模板为index.html,修改这里,其他不变index:path.resolve(__dirname,'../dist/templates/index.html'),//PathsssetsRoot:path.resolve(__dirname,'../分布'),...}使用如下命令编译vue项目npmrunbuild编译后文件目录如下将文件复制到springboot目录下将static下的css、fonts、img、js复制到/resources/static目录下springboot项目的复制index.html文件进入springboot项目的/resources/templates目录,添加Maven依赖org.springframework.bootspring-boot-starter-thymeleaf添加IndexController@Controller@RequestMapping("")publicclassIndexController{@RequestMapping("/index")publicStringindex(){return"index";}}这个controller的作用是在访问项目的/index路径时跳转到index.html并添加静态资源映射@ConfigurationpublicclassMvcConfigextendsWebMvcConfigurationSupport{@OverrideprotectedvoidaddResourceHandlers(ResourceHandlerRegistryregistry){registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/");}}这样就解决了静态资源无法访问的问题启动springboot项目以上步骤完成后,启动springboot项目以本地为例,浏览器可以访问http://localhost:8080/index