springboot整合vue（thy模板静态资源的访问）

最新推荐文章于 2023-08-03 17:58:44 发布

那那那

最新推荐文章于 2023-08-03 17:58:44 发布

阅读量1.1k

点赞数 1

分类专栏： springboot

本文链接：https://blog.csdn.net/weixin_42979818/article/details/100067712

版权

springboot 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1项目结构

在这里插入图片描述

2。html中引用js

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
<!--
    <script type="text/javascript" th:src="@{/js/vue.min.js}"></script>
-->

    <script type="text/javascript" th:src="@{/js/vue.min.js}"></script>

</head>
<body>

<div id="app">
    <p>

        {{
        message
        }}
    </p>
</div>

<script>
    new Vue({
        el:'#app',
        data:{
            message :'helle vue'
        }
    })
</script>

</body>
</html>

3.配置静态资源访问路径

package com.hy.test.controller;

import org.springframework.boot.autoconfigure.EnableAutoConfiguration;

import org.springframework.context.annotation.Configuration;
import org.springframework.util.ResourceUtils;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport;


@EnableAutoConfiguration
@Configuration
public class utils extends WebMvcConfigurationSupport {
    @Override
    protected void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/**").addResourceLocations(ResourceUtils.CLASSPATH_URL_PREFIX+"/templates/");
        registry.addResourceHandler("/**").addResourceLocations(ResourceUtils.CLASSPATH_URL_PREFIX+"/static/");

        super.addResourceHandlers(registry);
    }
}

在这里插入图片描述