Question

我正在尝试在Thymleafe应用中使用Bootstrap和SpringBoot。但是，我无法理解为什么SpringBoot没有选择Bootstrap。

当我运行我的项目时，它只显示plain-old HTML而不是选择Bootstrap。

的pom.xml

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>jquery</artifactId>
    <version>3.0.0</version>
</dependency>
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>bootstrap</artifactId>
    <version>4.0.0</version>
</dependency>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

的index.html

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
    xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="ISO-8859-1" />
<title>Home</title>

<script type="text/javascript" src="webjars/jquery/3.0.0/jquery.min.js"></script>
<script type="text/javascript" src="webjars/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css"
    href="webjars/bootstrap/4.0.0/css/bootstrap.min.css" />
</head>
<body>

    <div class="container">
        <h2>Please Login</h2>
        <form th:action="@{/users/login}" method="POST">
            <div class="form-group">
                <label for="email">Email:</label> <input type="email"
                    class="form-control" id="username" placeholder="Enter email"
                    name="username"></input>
            </div>
            <div class="form-group">
                <label for="pwd">Password:</label> <input type="password"
                    class="form-control" id="password" placeholder="Enter password"
                    name="password"></input>
            </div>
            <button type="submit" class="btn btn-primary">Submit</button>
        </form>
    </div> 
</body>
</html>

任何人都可以帮助我找不到的东西吗？

Answer 1

如果您的应用程序未在根上下文路径中运行，或者如果未在根路径中提供该页面，那么您的脚本和样式表引用将无法工作，因为它们是文档相关的。

考虑使用Theamleaf的URL功能构建URL，如下所示：

<link rel="stylesheet" th:href="@{/webjars/bootstrap/4.0.0/css/bootstrap.min.css}" />

<script>元素相同。在那里使用th:src属性。

有关详细信息，请参阅此处： http://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#link-urls

SpringBoot没有使用Thymleafe获取Bootstrap

1 个答案: