title: Spring Boot and Thymeleaf: Can't find HTML templates
body: <p>I am trying to create a Spring Boot-based application with Thymeleaf. I am using the <a href="https://github.com/spring-projects/spring-petclinic" rel="nofollow noreferrer">PetClinic</a> sample as a starting point. 
  My application can't find some of the templates.</p>
  
  <p>My project is set up in the standard way:</p>
  
  <pre><code>/src
   /main
    /java
     /com.example
      MyWebApplication.java
      HomeController.java
    /resources
     /static
      /css
     /templates
      /fragments
       layout.html
      home.html
    application.properties
  </code></pre>
  
  <p><strong>pom.xml</strong></p>
  
  <pre><code>&lt;parent&gt;
      &lt;groupId&gt;org.springframework.boot&lt;/groupId&gt;
      &lt;artifactId&gt;spring-boot-starter-parent&lt;/artifactId&gt;
      &lt;version&gt;1.5.1.RELEASE&lt;/version&gt;
      &lt;relativePath/&gt; &lt;!-- lookup parent from repository --&gt;
  &lt;/parent&gt;
  
  &lt;properties&gt;
      &lt;project.build.sourceEncoding&gt;UTF-8&lt;/project.build.sourceEncoding&gt;
      &lt;project.reporting.outputEncoding&gt;UTF-8&lt;/project.reporting.outputEncoding&gt;
      &lt;java.version&gt;1.8&lt;/java.version&gt;
  &lt;/properties&gt;
  
  &lt;dependencies&gt;
      &lt;dependency&gt;
          &lt;groupId&gt;org.springframework.boot&lt;/groupId&gt;
          &lt;artifactId&gt;spring-boot-starter-thymeleaf&lt;/artifactId&gt;
      &lt;/dependency&gt;
      &lt;dependency&gt;
          &lt;groupId&gt;org.springframework.boot&lt;/groupId&gt;
          &lt;artifactId&gt;spring-boot-starter-web&lt;/artifactId&gt;
      &lt;/dependency&gt;
  
      &lt;dependency&gt;
          &lt;groupId&gt;org.springframework.boot&lt;/groupId&gt;
          &lt;artifactId&gt;spring-boot-starter-test&lt;/artifactId&gt;
          &lt;scope&gt;test&lt;/scope&gt;
      &lt;/dependency&gt;
      &lt;dependency&gt;
          &lt;groupId&gt;org.springframework.boot&lt;/groupId&gt;
          &lt;artifactId&gt;spring-boot-devtools&lt;/artifactId&gt;
          &lt;optional&gt;true&lt;/optional&gt;
      &lt;/dependency&gt;                   
  &lt;/dependencies&gt;
  </code></pre>
  
  <p><strong>MyWebApplication.java</strong></p>
  
  <pre><code>@SpringBootApplication
  public class MyWebApplication {
      public static void main(String[] args) {
          SpringApplication.run(MyWebApplication.class, args);
      }
  }
  </code></pre>
  
  <p><strong>HomeController.java</strong></p>
  
  <pre><code>@Controller
  public class HomeController {
  
      @RequestMapping("/")
      public String home() {
          return "home";
      }
  }
  </code></pre>
  
  <p><strong>home.html</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  
  &lt;html xmlns:th="http://www.thymeleaf.org" 
        xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
       th:replace="~{fragments/layout :: layout (~{::body},'home')}"&gt;
  &lt;body&gt;
      &lt;h2 th:text="#{welcome}"&gt;Welcome&lt;/h2&gt;
          &lt;div class="row"&gt;
          &lt;/div&gt;
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>layout.html</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  
  &lt;!-- 
      The main layout fragment that defines the overall layout
      Sets up the navigation bar
      The page contents are replaced in the main div
   --&gt;
  &lt;html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
          th:fragment="layout (template, menu)"&gt;
  
  &lt;head&gt;
  
    &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  
    &lt;!-- &lt;link rel="shortcut icon" type="image/x-icon" th:href="@{/images/favicon.png}"&gt; --&gt;  
  
    &lt;title&gt;Web Interface&lt;/title&gt;
  
    &lt;link rel="stylesheet" th:href="@{/css/bootstrap.min.css}" /&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  
    &lt;!-- Navigation Bar --&gt;
    &lt;nav class="navbar navbar-default" role="navigation"&gt;
      &lt;div class="container"&gt;
        &lt;div class="navbar-header"&gt;
          &lt;a class="navbar-brand glyphicon glyphicon-home" th:href="@{/}"&gt;&lt;/a&gt;
  
        &lt;!-- Collapse the menu bar on small windows --&gt;
          &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#main-navbar"&gt;
                    &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
                    &lt;span class="icon-bar"&gt;&lt;/span&gt;
                    &lt;span class="icon-bar"&gt;&lt;/span&gt;
                    &lt;span class="icon-bar"&gt;&lt;/span&gt;         
          &lt;/button&gt;      
        &lt;/div&gt;
  
        &lt;!-- The Navbar items --&gt;
        &lt;div class="navbar-collapse collapse" id="main-navbar"&gt;
          &lt;ul class="nav navbar-nav navbar-right"&gt;
  
            &lt;!-- Define a fragment for each menu item --&gt;
            &lt;li th:fragment="menuItem (path, active, title, glyph, text)" th:class="${active==menu ? 'active' : ''}"&gt;
              &lt;a th:href="@{__${path}__}" th:title=${title}&gt;
                &lt;span th:class="'glyphicon glyphicon-'+${glyph}" class="glyphicon glyphicon-home" aria-hidden="true"&gt;&lt;/span&gt;
                &lt;span th:text="${text}"&gt;Template&lt;/span&gt;
              &lt;/a&gt;
            &lt;/li&gt;
  
            &lt;!-- Replace with the fragment --&gt;
            &lt;li th:replace="::menuItem ('/', 'home', 'home page', 'home', 'Home')"&gt;
              &lt;span class="glyphicon glyphicon-home" aria-hidden="true"&gt;&lt;/span&gt;
              &lt;span&gt; Home&lt;/span&gt;
            &lt;/li&gt;                   
          &lt;/ul&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/nav&gt;
  
    &lt;!-- Main body --&gt;
    &lt;div class="container-fluid"&gt;
      &lt;div class="container xd-container"&gt;
        &lt;div th:replace="${template}"&gt;&lt;/div&gt;
      &lt;/div&gt;
  
    &lt;/div&gt;
  
    &lt;script th:src="@{/js/bootstrap.min.js}" type="text/javascript"&gt;&lt;/script&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>application.properties</strong> is empty.</p>
  
  <p>When I navigate to <code>http://localhost:8080</code> I get the error: </p>
  
  <blockquote>
    <p>Error resolving template "~{fragments/layout", template might not
    exist or might not be accessible by any of the configured Template
    Resolvers (home:5)</p>
  </blockquote>
  
  <p>If I remove the 'th:replace' attribute from home.html, it will display the welcome message.</p>
  
  <p>Browsing similar questions (e.g. <a href="https://stackoverflow.com/questions/41183212/springboot-thymeleaf-cant-find-any-template-except-home-template-mapping-no">this one</a>), I see other people create <code>ThymeleafViewResolver</code> bean. </p>
  
  <p>Questions:</p>
  
  <ol>
  <li>Why can't it find my templates?</li>
  <li>Do I need to create a template resolver? If so, how come the pet clinic sample doesn't? Where does its template resolver come from?</li>
  </ol>
  
  <p>As far as I can see it's set up the same way as the pet clinic sample, so what's the difference?</p>