SpringBoot Boostrap前端js/css文件配置

最新推荐文章于 2025-06-07 20:29:34 发布

Amy_HelloWorld

最新推荐文章于 2025-06-07 20:29:34 发布

阅读量1.5w

点赞数

分类专栏： 0.Java 文章标签： SpringBoot Bootstrap 静态文件 Js css

0.Java 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了SpringBoot中处理静态资源映射的方法，包括通过配置文件指定路径和使用WebJars来简化依赖管理及资源引用的过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

感谢作者的分享：https://www.cnblogs.com/smiler/p/6857213.html

http://blog.youkuaiyun.com/isea533/article/details/50412212

1.按理SpringBoot会自动加载resources/static下面的静态文件（js/css等），但因为路径的问题前台页面引用都失败。

考虑到项目肯定会有自定义的css.js.img等静态文件，这个需要后续更新处理；

2.方式1没有成功，在网上找到另外一种方式：WebJars

2.1pom文件中添加：

<properties>
    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
    <java.version>1.8</java.version>
    <webjars-locator>0.32-1</webjars-locator>
    <bootstrap>4.0.0</bootstrap>
    <jquery>3.3.1</jquery>
  </properties>

<!-- webjars-locator-->
<!--webjars-locator 包的作用是省略 webjar 的版本。比如对于请求 http://localhost:8080/webjars/jquery/3.1.0/jquery.js省略版本号 3.2.1 直接使用http://localhost:8080/webjars/jquery/jquery.js也可访问。-->
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>webjars-locator</artifactId>
    <version>${webjars-locator}</version>
</dependency>

<!-- bootstrap -->
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>bootstrap</artifactId>
    <version>${bootstrap}</version>
</dependency>

<!-- jquery -->
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>jquery</artifactId>
    <version>${jquery}</version>
</dependency>

2.2前台文件引用

<head>
    <script src="/webjars/jquery/jquery.min.js"></script>
    <script src="/webjars/bootstrap/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/webjars/bootstrap/css/bootstrap.min.css"/>
    <meta charset="UTF-8">
    <title>Insert title here</title>
</head>

2.3启动验证

ps我的demo地址：https://github.com/luomouren/springbootdemo

3.方式1找到解决方法了，无意中看到参考文档2解决的(感谢作者分享）

配置资源映射

Spring Boot 默认配置的/**映射到/static（或/public ，/resources，/META-INF/resources），/webjars/**会映射到classpath:/META-INF/resources/webjars/。

所以在application.properties文件中添加配置：

#设定静态文件路径，js,css等
spring.mvc.static-path-pattern=/**

在前台中引用

<script src="/js/test/test.js"></script>

在resources下新建static文件，里面直接放js文件夹，存js文件

配置资源映射

Spring Boot 默认配置的/**映射到/static（或/public ，/resources，/META-INF/resources），/webjars/**会映射到classpath:/META-INF/resources/webjars/。