首页 前端知识 springboot整合vue,将vue项目整合到springboot项目中

springboot整合vue,将vue项目整合到springboot项目中

2024-04-19 21:04:53 前端知识 前端哥 425 365 我要收藏

将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";
}
}
复制

转载请注明出处或者链接地址:https://www.qianduange.cn//article/5339.html
标签
评论
还可以输入200
共0条数据,当前/页
发布的文章

JQuery中的load()、$

2024-05-10 08:05:15

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!