Spring Boot 不引入模板引擎加载 HTML 网页等资源

Spring Boot HTML About 1,608 words

配置文件

最主要配置spring.mvc.static-path-pattern和spring.resources.static-locations位置。

spring:
  mvc:
    static-path-pattern: /**
  resources:
    static-locations: classpath:/templates/,classpath:/static/

HTML

注意：css、js等资源文件必须在static目录的子目录下，在static根目录下将得到404资源找不到异常。而页面则可以位于templates文件夹根目录，若有多级路径则对应子目录即可。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="/css/index.css">
    <title>Title</title>
</head>
<body>
<div id="app">
    <el-button @click="visible = true">点击</el-button>

    <el-dialog :visible.sync="visible" title="Hello world">
        <p>Try Element</p>
    </el-dialog>
</div>
</body>
<script src="/js/vue.js"></script>
<script src="/js/index.js"></script>
<script>
    new Vue({
        el: '#app',
        data: function() {
            return {
                visible: false
            }
        }
    })
</script>
</html>

Controller

在IDEA中可能会提示：Cannot resolve MVC View 'index.html'，无视或忽略之。

@Controller
public class IndexController {

    @GetMapping("/")
    public String index() {
        return "index.html";
    }

}

目录结构

在PowerShell中使用tree /F /A查看目录结构。

\---resources
    |   application.yml
    |
    +---static
    |   +---css
    |   |   |   index.css
    |   |   |
    |   |   \---fonts
    |   |           element-icons.ttf
    |   |           element-icons.woff
    |   |
    |   \---js
    |           index.js
    |           vue.js
    |
    \---templates
            index.html

Views: 2,397 · Posted: 2020-11-17

———— END ————

Give me a Star, Thanks:)

https://github.com/fendoudebb/LiteNote

扫描下方二维码关注公众号和小程序↓↓↓