SpringBoot结合前端有很多种方法，比如在static里面直接加入css或js，又或者引入webjars，以jar包的形式加入项目，本文就是简单介绍一下这种方式。...然后在pom文件引入webjars的jar，pom文件代码如下： 0.0.1-SNAPSHOT jar springboot_webjars... springboot_webjars org.springframework.boot...至此SpringBoot结合WebJars成功就完成。 源码下载 ：大老杨码云
在看springboot源码时候,看到了加载webjars目录下,我就好奇webjars是什么?...,所以找了一下资料 这里是webjars的网址 webjars介绍 这里我引入了我查找资料时的话 WebJars是将客户端（浏览器）资源（JavaScript，Css等）打成jar包文件，以对资源进行统一依赖管理...WebJars的jar包部署在Maven中央仓库上 对于日常的web开发而言，像css、js、images、font等静态资源文件管理是非常的混乱的、比如jQuery、Bootstrap、Vue.js...所以找到了一个叫做WebJars的技术，下面我将介绍如何将静态资源打包成jar原本我们在进行web开发时，一般上都是讲静态资源文件放置在webapp目录下 在SpringBoot里面，一般是将资源文件放置在...也是利用了此功能，将所有前端的静态文件打包成一个jar包，这样对于引用放而言，和普通的jar引入是一样的，还能很好的对前端静态资源进行管理 WebJars是一个很神奇的东西，可以以jar包的形式来使用前端的各种框架和组件
-- 引入jquery-webjar--> org.webjars...jquery 3.3.1 1、webjars...是jar包的方式引入静态资源，所有/webjars/**，都去classpath:/META-INF/resources/webjars/资源 pom注入资源后启动应用可访问 ?
依赖 org.webjars webjars-locator ${project.build.outputDirectory}/META-INF/resources/webjars... 使用模块中的静态资源 /webjars/xxx
使用WebJars依赖 我们来创建一个SpringBoot项目，在项目的pom.xml文件内添加如下依赖： org.example webjars-sample...通过IDEA工具我们可以查看webjars-sample依赖内的资源文件，如下图所示： image 由于SpringBoot提供的spring.resources.static-locations参数默认值...总结 如果你有一些资源不希望被别人修改，让使用者更加便利的集成时，可以采用这种方式来封装自己的webjars，只需要添加依赖引用就可以访问到静态资源，也可以将静态HTML网页通过这种方式打包。
1 导入jQuery的webjars依赖 org.webjars 3.5.0 2 前端的HTML里面导入jQuery webjars
项目中使用的时候 在这里我用了Thymeleaf模板：css等其他资源不一 一演示了 webjars/bootstrap
WebJars是打包到JAR（Java Archive）文件中的客户端Web库（例如jQuery和Bootstrap）。...-- https://mvnrepository.com/artifact/org.webjars/webjars-locator --> org.webjars webjars-locator 0.32...-1 org.webjars webjars/jquery/3.1.0/jquery.js省略版本号 3.2.1 直接使用http://localhost:8080/webjars
"> WebJars Demo webjars/bootstrap/3.3.7-1... org.webjars webjars-locator ... WebJars Demo webjars/bootstrap/3.3.7-1/css/bootstrap.min.css..." /> -> webjars/jquery/jquery.min.js"> webjars/bootstrap/js.../bootstrap.min.js"> WebJars Demo webjars/bootstrap
/lib/jquery-1.8.0.min.js' type='text/javascript'>script> webjars/springfox-swagger-ui.../lib/handlebars-4.0.5.js' type='text/javascript'>script> webjars/springfox-swagger-ui.../lib/lodash.min.js' type='text/javascript'>script> webjars/springfox-swagger-ui/lib/...' type='text/javascript'>script> webjars/springfox-swagger-ui/lib/jsoneditor.min.js'...'>script> webjars/springfox-swagger-ui/springfox.js' type='text/javascript'>script>
它就是Webjars[1]。...我们完全可以约定一套目录规则，把后端webjars的依赖版本，直接传递到后端。而负责完成维护管理这套目录规则的人就是webjars-locator。...我们要想使用webjars-locator，先要添加依赖： //Group: org.webjars.bower // https://mvnrepository.com/artifact.../org.webjars/webjars-locator compile group: 'org.webjars', name: 'webjars-locator', version: '0.32...本章节完整的工程代码： https://github.com/EasySpringBoot/h5perf 参考资料： 1.WebJars：http://www.webjars.org/
registry.hasMappingForPattern("/webjars/**")) { customizeResourceHandlerRegistration(...registry.addResourceHandler("/webjars/**") ....addResourceLocations( "classpath:/META-INF/resources/webjars/.../** ，都去 classpath:/META-INF/resources/webjars/ 找资源；== webjars：以jar包的方式引入静态资源； localhost:8080/webjars...--引入jquery-webjar-->在访问的时候只需要写webjars下面资源的名称即可 org.webjars<
("/webjars/**") .addResourceLocations("classpath:/META-INF/resources/webjars/") .setCachePeriod...("/webjars/**") .addResourceLocations("classpath:/META-INF/resources/webjars/") .setCachePeriod...(getSeconds(cachePeriod)).setCacheControl(cacheControl)); } 找项目里面的webjars目录，但是我们在我们的项目里面没有看到。...现在我们要解决的是什么是webjars？...已经解决了什么是webjars 解释3 获取静态资源的路径 String staticPathPattern = this.mvcProperties.getStaticPathPattern();
spring-boot-starter-websocket org.webjars... webjars-locator org.webjars...>sockjs-client 1.0.2 org.webjars.../jquery/jquery.min.js"> webjars/sockjs-client/sockjs.min.js">...webjars/stomp-websocket/stomp.min.js">
对于 Maven，您需要添加以下依赖项： org.webjars webjars-locator-core... webjars-locator-core org.webjarswebjars-locator-core' implementation 'org.webjars:sockjs-client:1.0.2' implementation 'org.webjars:stomp-websocket...:2.3.3' implementation 'org.webjars:bootstrap:3.3.7' implementation 'org.webjars:jquery:3.1.1-1'复制 以下清单显示了完成的...:webjars-locator-core' 实施 'org.webjars:sockjs-client:1.0.2' 实现 'org.webjars:stomp-websocket:2.3.3'
重学SpringBoot系列之整合静态资源与模板引擎 webjars与静态资源 spring boot静态资源 favicon.ico图标 欢迎页面 使用WebJars管理css&js 1.pom中引入依赖...---- 使用WebJars管理css&js 为什么使用 WebJars？ 显而易见，因为简单。...关于webjars资源，有一个专门的网站https://www.webjars.org/，我们可以到这个网站上找到自己需要的资源，在自己的工程中添加入maven依赖，即可直接使用这些资源了。...1.pom中引入依赖 我们可以从WebJars官方查看maven依赖，如下图 例如:将bootstrap和jquery引入pom文件中 org.webjars...>0.30 引入 webjars-locator 值后可以省略版本号: webjars/jquery/jquery.min.js
先说一下什么是webjars？...WebJars 就是将js, css 等资源文件放到 classpath:/META-INF/resources/webjars/ 中，然后打包成jar 发布到maven仓库中。...简单应用 以jQuery为例，文件存放结构为： META-INF/resources/webjars/jquery/2.1.4/jquery.js META-INF/resources/webjars/...webjars/jquery/2.1.4/webjars-requirejs.js Spring Boot 默认将 /webjars/** 映射到 classpath:/META-INF/resources...我们使用第三方的库时，建议使用webjars的方式，通过动态版本号（webjars-locator 的方式）来使用（因为第三方库在项目开发中变动频率很小，即便是变动也是版本号的修改）。
DOCTYPE html> webjars/jquery/3.1.1/jquery.min.js"> webjars/bootstrap/3.3.7-1/js/bootstrap.min.js"> WebJars Demo webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" /> <div...* User: a247292980 * Date: 2017/08/14 * * webjars-locator 包的作用是处理WebJars，省略 webjar 的版本。...* 比如对于请求 http://localhost:8080/webjars/jquery/3.1.0/jquery.js省略版本号 3.2.1 * 直接使用http://localhost:8080
p=4 什么是WebJars 什么是WebJars？WebJars是将客户端（浏览器）资源（JavaScript，Css等）打成jar包文件，以对资源进行统一依赖管理。...WebJars的jar包部署在Maven中央仓库上。...那么WebJars就提供给我们这些前端资源的jar包形式，我们就可以进行依赖管理。...关于webjars资源，有一个专门的网站http://www.webjars.org/，我们可以到这个网站上找到自己需要的资源，在自己的工程中添加入maven依赖，即可直接使用这些资源了。...1、 WebJars主官网 查找对于的组件，比如Vuejs org.webjars.bower vue
-- import vue--> webjars/vue/dist/vue.min.js}">...-- i18n --> webjars/iview/dist/locale/zh-CN.js}..."> 因为是通过webjars引入的前端依赖库，所有都是通过maven来管理的： org.webjars webjars-locator 0.32-1...这里要提到webjars-locator这样一个jar，帮助我们处理了所有版本问题，所以在引入的时候不会有相关的版本信息在路径中。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
腾讯会议
云直播
对象存储
