layout:decorateが反映されない【書籍 はじめてのSpring Boot】

##環境

Thymeleaf 3.0
Spring Boot 2.4.2
Mac OS Big Sur
Maven


##状況

以下のコードのようにlayout:flagmentとlayout:decorateを用いてテンプレートを取り込もうとしていた。

ディレクトリ構造

```
|-template
    |
    |-- customers
    |      |
    |      |-- edit.html
    |      |-- list.html
    |
    |-- commons
           |
           |-- layout.html

```

layout.html(テンプレート部分)

```html

<!DOCTYPE html>
<html  xmlns="http://www.w3.org/1999/xhtml"
	   xmlns:th="http://www.thymeleaf.org"
       xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
  <title>layout</title>
</head>
<body>
  <div class="container">
    <h1 class="text-center text-primary mt-5">顧客管理システム</h1>
    <div>
    </div>
    <div layout:fragment="content">
      Fake Content
    </div>
  </div>
</body>
</html>

```

list.html (フラグメント部分)

```html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org/" xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
  layout:decorate ="~{/commons/layout}">

<head>
  <title>顧客一覧</title>
</head>

<body>
  <div layout:fragment="content" class="col-sm-12">
    <form th:action="@{/customers/create}" th:object="${customerForm}" method="POST">
      <dl>
        <dt><label for="lastName">姓</label></dt>
        <dd>
          <input type="text" id="lastName" name="lastName" th:field="*{lastName}" th:errorclass="error-input"
            value="山田" />
          <span th:if="${#fields.hasErrors('lastName')}" th:errors="*{lastName}" class="error-messages">error!</span>
        </dd>
      </dl>
      <dl>
        <dt><label for="firstName">名</label></dt>
        <dd>
          <input type="text" id="firstName" name="firstName" th:field="*{firstName}" th:errorclass="error-input"
            value="太郎" />
          <span th:if="${#fields.hasErrors('firstName')}" th:errors="*{firstName}" class="error-messages">error!</span>
        </dd>
      </dl>
      <input type="submit" value="作成">
    </form>
    <table>
      <tr th:each="customer : ${customers}">
        <td th:text="${customer.id}">100</td>
        <td th:text="${customer.lastName}">山田</td>
        <td th:text="${customer.firstName}">太郎</td>
        <td>
          <form th:action="@{/customers/edit}" method="GET">
            <input type="submit" name="form" value="編集">
            <input type="hidden" name="id" th:value="${customer.id}" />
          </form>
        </td>
        <td>
          <form th:action="@{/customers/delete}" method="POST">
            <input type="submit" value="削除">
            <input type="hidden" name="id" th:value="${customer.id}" />
          </form>
        </td>
      </tr>
    </table>
  </div>
</body>

</html>
```

list.htmlの冒頭に**layout:decorate ="~{/commons/layout}"**を記述することでフラグメントとして導入されるテンプレートファイルを指定することができる。

しかし、このlayout:deocorateを書籍通り記述するもフラグメントとして組み込まれない。

##pom.xmlに追記

layout:decorateが機能しない理由はdecorateが依存関係に追加されていないから。
どうやらみなさんがよく使うであろう「spring-boot-starter-thymeleaf」にはdocorate機能がない。
だからdocorateを依存関係に追加するためpom.xmlに以下のコードを追記する。


```xml
<dependency>
<groupId>nz.net.ultraq.thymeleaf</groupId>
<artifactId>thymeleaf-layout-dialect</artifactId>
</dependency>

```
これで正しく反映されます！