java - Thymeleaf 和 Spring Boot，如何构建 Assets 文件夹以在运行时和设计时查看 html

Question

我有一个 Spring Boot 2 项目并使用 Thymeleaf 模板引擎。文件夹结构为:

main\
  resources\
    static\
      assets\
        css\
          my.css
        js\

    templates\
      index.html

(1) 如果我在index.html中引用my.css为../static/assets/css/my.css，我可以直接在浏览器中查看index.html(file:///path/to/main/resources/templates/index.html) 但如果我在 JetBrains IDEA 中运行该项目，并将其浏览为 http://localhost:8080/ ，浏览器控制台告诉找不到 my.css。

(2) 如果我在index.html中引用my.css为assets/css/my.css，当我直接在浏览器中查看index.html时(file:///path/to/main/resources/templates/index.html) 浏览器告诉找不到 my.css，但是如果我在 JetBrains IDEA 中运行该项目，并将其浏览为 http://localhost:8080/ , 浏览器 View 就OK了。

因为 Thymeleaf 网站说它对设计时、运行时以及与程序员和设计师的合作都很友好，那么谁能告诉我如何构建我的静态资源和 html 模板文件夹关系来实现这个目标？先谢谢了!

Answer 1

在 Spring boot 中，静态文件从位置 src/main/resources/static 提供，并且在应用程序 URL 的根目录下可用。例如，如果您有 src/main/resources/static/assets/css/my.css，那么当您运行该应用程序时，它位于 http://localhost 位置: 8080/assets/css/my.css.

因此您可以将其包含在您的 index.html 中，如下所示:

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

这样，当您在浏览器中打开 index.html 时，它将使用 href 检测 CSS，当您通过服务器启动它时，即通过运行应用程序然后在浏览器中打开它，然后 Thymeleaf 将处理 th:href。所以它在这两种情况下都适用。