将vue项目打包后,与springboot项目整合。
第一步,使用springboot中的thymeleaf模板引擎
导入依赖
<!-- thymeleaf 模板 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
复制
在resources目录下建立static文件夹和templates文件夹
在yml中配置thymeleaf
spring: # 模板引擎 thymeleaf: mode: HTML5 encoding: utf-8 # 禁用缓存 cache: false
复制
在配置中打开访问静态文件的权限
public class ResourceConfig implements WebMvcConfigurer { @Override public void addResourceHandlers(ResourceHandlerRegistry registry) { registry.addResourceHandler("/**").addResourceLocations("classpath:/static/"); } }
复制
第二步:将vue项目打包后中的静态文件放入static文件夹中,将index.html放入templates文件夹中
第三步:在controller中写路由,让其跳转index.html页面
@Controller @CrossOrigin public class IndexController { @GetMapping("/") public String index(){ return "index"; } }
复制