前言
Springboot默认是不支持JSP的，默认使用thymeleaf模板引擎。所以这里介绍一下Springboot使用Thymeleaf的实例以及遇到的问题。

配置与使用
1.在application.properties文件中增加Thymeleaf模板的配置。
#关闭thymeleaf的缓存，不然在开发过程中修改页面不会立刻生效需要重启，生产可配置为true

#关闭thymeleaf的缓存，不然在开发过程中修改页面不会立刻生效需要重启，生产可配置为true

spring.thymeleaf.cache=false

spring.thymeleaf.prefix=classpath:/web/

spring.thymeleaf.suffix=.html

spring.thymeleaf.mode=HTML5

spring.thymeleaf.encoding=UTF-

spring.thymeleaf.content-type=text/html

spring.resources.chain.strategy.content.enabled=true

spring.resources.chain.strategy.content.paths=/**

说明一下，这些配置不是必须的，如果配置了会覆盖默认的。

2.在pom.xml中添加thymeleaf的依赖

<dependency>

    <groupId>org.springframework.boot</groupId>

    <artifactId>spring-boot-starter-thymeleaf</artifactId>

</dependency>

3、编写一个测试的Controller

package com.lynch.web;

import org.springframework.stereotype.Controller;

import org.springframework.web.bind.annotation.RequestMapping;

@Controller

@RequestMapping("/layui")

public class LayuiController {

    @RequestMapping("/index")

    public String demo() {

        return "layui/index";

    }

}

可以看到，Controller与普通的SpringMVC的Controller无异。

4、编写index.html
默认情况下：
spring-boot项目静态文件目录：/src/java/resources/static （比如：js、css、img等静态资源）
spring-boot项目模板文件目录：/src/java/resources/templates （所有的页面文件，这个地方我已经通过application.properties 将 templates 改为了web）
所以index.html文件在/src/java/resources/web/layui下。

<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>layout 后台大布局 - Layui</title>

<link th:href="@{/layui/css/layui.css}" rel="stylesheet" />

</head>

<body class="layui-layout-body">

    <div class="layui-layout layui-layout-admin">

        <div class="layui-header">

            <div class="layui-logo">layui 后台布局</div>

            <!-- 头部区域（可配合layui已有的水平导航） -->

            <ul class="layui-nav layui-layout-left">

                <li class="layui-nav-item"><a href="">控制台</a></li>

                <li class="layui-nav-item"><a href="">商品管理</a></li>

                <li class="layui-nav-item"><a href="">用户</a></li>

                <li class="layui-nav-item"><a href="javascript:;">其它系统</a>

                    <dl class="layui-nav-child">

                        <dd>

                            <a href="">邮件管理</a>

                        </dd>

                        <dd>

                            <a href="">消息管理</a>

                        </dd>

                        <dd>

                            <a href="">授权管理</a>

                        </dd>

                    </dl></li>

            </ul>

            <ul class="layui-nav layui-layout-right">

                <li class="layui-nav-item"><a href="javascript:;"> aaa 贤心 </a>

                    <dl class="layui-nav-child">

                        <dd>

                            <a href="">基本资料</a>

                        </dd>

                        <dd>

                            <a href="">安全设置</a>

                        </dd>

                    </dl></li>

                <li class="layui-nav-item"><a href="">退了</a></li>

            </ul>

        </div>

        <div class="layui-side layui-bg-black">

            <div class="layui-side-scroll">

                <!-- 左侧导航区域（可配合layui已有的垂直导航） -->

                <ul class="layui-nav layui-nav-tree" lay-filter="test">

                    <li class="layui-nav-item layui-nav-itemed"><a class=""

                        href="javascript:;">所有商品</a>

                        <dl class="layui-nav-child">

                            <dd>

                                <a href="javascript:;">列表一</a>

                            </dd>

                            <dd>

                                <a href="javascript:;">列表二</a>

                            </dd>

                            <dd>

                                <a href="javascript:;">列表三</a>

                            </dd>

                            <dd>

                                <a href="">超链接</a>

                            </dd>

                        </dl></li>

                    <li class="layui-nav-item"><a href="javascript:;">解决方案</a>

                        <dl class="layui-nav-child">

                            <dd>

                                <a href="javascript:;">列表一</a>

                            </dd>

                            <dd>

                                <a href="javascript:;">列表二</a>

                            </dd>

                            <dd>

                                <a href="">超链接</a>

                            </dd>

                        </dl></li>

                    <li class="layui-nav-item"><a href="">云市场</a></li>

                    <li class="layui-nav-item"><a href="">发布商品</a></li>

                </ul>

            </div>

        </div>

        <div class="layui-body">

            <!-- 内容主体区域 -->

            <div style="padding: 15px;">内容主体区域</div>

        </div>

        <div class="layui-footer">

            <!-- 底部固定区域 -->

            © layui.com - 底部固定区域

        </div>

    </div>

    <script th:src="@{/layui/layui.js}"></script>

    <script>

        //JavaScript代码区域

        layui.use('element', function() {

            var element = layui.element;

        });

    </script>

</body>

</html>

5、引入layui
从https://www.layui.com/下载layui-v2.4.5.zip，解压后把layui-v2.4.5目录下的layui文件夹拷贝到/src/java/resources/static目录下。

6、效果图
项目启动成功，访问http://localhost:8080/layui/index，运行效果如下：

Springboot+Thymeleaf+layui框架的配置与使用的更多相关文章

  1. springboot+Thymeleaf+layui 实现分页

    layui分页插件 引入相关的js和css layui:css <link rel="stylesheet" th:href="@{layui/css/layui. ...

  2. java框架之SpringBoot(5)-SpringMVC的自动配置

    本篇文章内容详细可参考官方文档第 29 节. SpringMVC介绍 SpringBoot 非常适合 Web 应用程序开发.可以使用嵌入式 Tomcat,Jetty,Undertow 或 Netty ...

  3. Springboot+Thymeleaf框架的button错误

    ---恢复内容开始--- 在做公司项目时,遇到了一个Springboot+Thymeleaf框架问题: 使用框架写网站时,没有标明type类型的button默认成了‘submit’类型,每次点击按钮都 ...

  4. springBoot日志框架自动配置与原理

    1.日志框架 小张:开发一个大型系统: ​ 1.System.out.println(""):将关键数据打印在控制台:去掉?写在一个文件? ​ 2.框架来记录系统的一些运行时信息: ...

  5. layui表格数据渲染SpringBoot+Thymeleaf返回的数据时报错（Caused by: org.attoparser.ParseException: Could not parse as expression: ")

    layui table渲染数据时报错(Caused by: org.attoparser.ParseException: Could not parse as expression: ") ...

  6. 权限管理系统之SpringBoot集成LayUI实现后台管理首页

    万事开头难,昨天一直在构思用户权限管理系统怎么实现,实现哪些需求,采用什么技术等,也在网上百度了好多,计划使用SpringBoot + Mybatis + thymeleaf  + LayUI + S ...

  7. springboot深入学习(二)-----profile配置、运行原理、web开发

    一.profile配置 通常企业级应用都会区分开发环境.测试环境以及生产环境等等.spring提供了全局profile配置的方式,使得在不同环境下使用不同的applicaiton.properties ...

  8. 不要再学 JSP 了，学 SpringBoot + Thymeleaf + Vue吧

    老读者就请肆无忌惮地点赞吧,微信搜索[沉默王二]关注这个在九朝古都洛阳苟且偷生的程序员.本文 GitHub github.com/itwanger 已收录,里面还有我精心为你准备的一线大厂面试题. 读 ...

  9. layUI框架中文件上传前后端交互及遇到的相关问题

    下面我将讲述一下我在使用layUI框架中文件上传所遇到的问题: 前端jsp页面: <div class="layui-form-item"> <label cla ...

随机推荐

  1. 解决：AttributeError: module 'requests' has no attribute 'post'”

    今天学习Requests库,当用pip install requests安装后,写了一段代码报错:AttributeError: module ‘requests‘ has no attribute ...

  2. C++ 提取网页内容系列之四正则

    标 题: C++ 提取网页内容系列之四作 者: itdef链 接: http://www.cnblogs.com/itdef/p/4173833.html 欢迎转帖 请保持文本完整并注明出处 将网页内 ...

  3. boost asio 学习(三)post与dispatch

    http://www.gamedev.net/blog/950/entry-2249317-a-guide-to-getting-started-with-boostasio?pg=4 本章节为io_ ...

  4. 命令方式联网与界面network-manager方式联网

    命令方式联网: sudo vi /etc/NetworkManager/NetworkManager.conf [main]plugins=ifupdown,keyfile,ofonodns=dnsm ...

  5. 参考文献bib管理

    比如在IEEE模板中,在当前目录添加 bib 文件reference.bib 在 \end{document} 之前加入 \bibliographystyle{IEEEtran} \bibliogra ...

  6. EntityFramWork(3 code First 约定)

      Code First 约定 借助 Code First,可通过使用 C# 或 Visual Basic .NET 类来描述模型.模型的基本形状可通过约定来检测.约定是规则集,用于在使用 Code ...

  7. JavaScript基础视频教程总结（031-040章）

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  8. Makefile基础学习

    Makefile基础学习 理论知识 makefile关系到了整个工程的编译规则.一个工程中的源文件不计其数,并且按类型.功能.模块分别放在若干个目录中,makefile定义了一系列的规则来指定,哪些文 ...

  9. hdu 1069 Monkey and Banana 【动态规划】

    题目 题意:研究人员要测试猴子的IQ,将香蕉挂到一定高度,给猴子一些不同大小的箱子,箱子数量不限,让猩猩通过叠长方体来够到香蕉. 现在给你N种长方体, 要求:位于上面的长方体的长和宽  要小于  下面 ...

  10. samba服务配置（一）

    samba是一个实现不同操作系统之间文件共享和打印机共享的一种SMB协议的免费软件. samba软件结构: /etc/samba/smb.conf    #samba服务的主要配置文件 /etc/sa ...