【问题标题】:Static resources not loaded in thymeleaf templatethymeleaf 模板中未加载的静态资源
【发布时间】:2015-01-05 17:29:57
【问题描述】:

我是 spring thymeleaf 的新手,我有一个分为页眉、正文和页脚的网页,但是当我尝试包含页眉时,css 和 js 不会加载到网页中。

我的文件夹结构如下:

???? main
  ├─── ???? java
  ├─── ???? resources
  ├─── ???? web-resources
  │   ├─── ???? css
  │   ├─── ???? jss
  │   └─── ???? views
  └─── ???? webapp
      ├─── ???? META-INF
      └─── ???? resources
          ├─── ???? css
          ├─── ???? jss
          └─── ???? views

而我的百里香叶配置是:

<bean id="templateResolver"
      class="org.thymeleaf.templateresolver.ServletContextTemplateResolver">
    <property name="prefix" value="/resources/views/"/>
    <property name="suffix" value=".html"/>
    <property name="templateMode" value="HTML5"/>
    <!-- Template cache is set to false (default is true). -->
    <property name="cacheable" value="false"/>
</bean>

<bean id="templateEngine" class="org.thymeleaf.spring4.SpringTemplateEngine">
    <property name="templateResolver" ref="templateResolver"/>
</bean>

<bean class="org.thymeleaf.spring4.view.ThymeleafViewResolver">
    <property name="templateEngine" ref="templateEngine"/>
</bean>

我的标题 css 如下所示:

<head>
    <meta charset="utf-8"/>
    <title>test</title>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>

    <link type="text/css" href="../../css/bootstrap-min.css" rel="stylesheet"
          th:href="@{/resources/css/bootstrap-min.css}"/>

    <link type="text/css" href="../../css/bootstrap-theme-min.css" rel="stylesheet"
          th:href="@{/resources/css/bootstrap-theme-min.css}"/>

    <script src="../../js/jquery-1.11.1.min.js"></script>
    <script src="../../js/bootstrap-min.js"></script>
</head>

主要的html是:

<head>
    <title>Hello</title>

    <link type="text/css" href="../css/bootstrap-min.css" rel="stylesheet"
          th:href="@{/resources/css/bootstrap-min.css}"/>

    <link type="text/css" href="../css/bootstrap-theme-min.css" rel="stylesheet"
          th:href="@{/resources/css/bootstrap-theme-min.css}"/>

    <script src="../js/jquery-1.11.1.min.js" th:src="@{/resources/js/jquery-1.11.1.min.js}"></script>
    <script src="../js/bootstrap-min.js" th:src="@{/resources/js/bootstrap-min.js}"></script>
</head>
<body>
<div th:include="fragments/header :: header"></div>
</body>

但是当我请求页面时,css和jss仍然显示404。

【问题讨论】:

    标签: javascript css spring thymeleaf


    【解决方案1】:

    不要在片段中重复 head 元素。您目前正在做的是尝试在 body 中附加一个重复的 head 元素。就像在 jsp 导入中所做的那样,仅在片段中包含标题的正文部分。

    【讨论】:

    • 感谢回复,我已经通过更正spring mvc配置中的资源路径解决了这个问题,但没有考虑重复头。非常感谢您指出潜在问题。
    【解决方案2】:

    你可以改变:

    <script src="../../js/bootstrap-min.js"></script>
    

    <script th:src="@{/resources/js/bootstrap-min.js"></script>
    

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-09-11
    • 1970-01-01
    • 2016-08-17
    • 2023-02-15
    • 2017-07-26
    • 2015-11-13
    • 2015-03-08
    • 2014-12-10
    相关资源
    最近更新 更多