SpringBoot集成thymeleaf
1.首先在pom文件中加入以下依赖
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
2.在appliaction.properties中添加一下配置
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
spring.thymeleaf.mode=LEGACYHTML5
#开发时关闭缓存,不然没法看到实时页面
spring.thymeleaf.cache=false
3.在resources下创建templates文件夹,在该文件夹下创建html文件即可。
thymeleaf页面模板
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>thymeleaf template</title>
</head>
<body>
<h1>Thymeleaf模板文件</h1>
</body>
</html>
公共js、css的引入
1.首先写一个head.html,内容如下,其中要加入的js,css可以根据自己的需求添加
<head th:fragment="commonHead(title)">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title th:text="${title}">Title</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- jquery ui组件引用 提示框-->
<link rel="stylesheet" type="text/css" th:href="@{/common/jquery-ui-1.11.4/jquery-ui.min.css}" />
<!-- jquery组件引用 -->
<script th:src="@{/common/jquery/jquery-1.12.4.min.js}"></script>
<script type="text/javascript">
// 项目路径
/* var ctx = "${pageContext.request.contextPath}"; */
var ctx = "/projectName";
</script>
</head>
其中引入的静态资源在resources/static/common/jquery目录下,head.html在resources/templates目录下
2.在其他页面中使用上面所创建的head.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="head :: commonHead('验证公共静态资源的引入')"></head>
<body>
<h1>Thymeleaf模板文件</h1>
</body>
</html>
其中<head th:replace="head :: commonHead('验证js')"></head>中的head对应head.html的名字,commonHead对应head.html中的th:fragment="commonHead(title)"