WebJars介绍及使用
转载: https://blog.csdn.net/q_0718/article/details/80105318
WebJars是一个很神奇的东西,可以让大家以jar包的形式来使用前端的各种框架、组件。
什么是WebJars
什么是WebJars?WebJars是将客户端(浏览器)资源(JavaScript,Css等)打成jar包文件,以对资源进行统一依赖管理。WebJars的jar包部署在Maven中央仓库上。
为什么使用
我们在开发Java web项目的时候会使用像Maven,Gradle等构建工具以实现对jar包版本依赖管理,以及项目的自动化管理,但是对于JavaScript,Css等前端资源包,我们只能采用拷贝到webapp下的方式,这样做就无法对这些资源进行依赖管理。那么WebJars就提供给我们这些前端资源的jar包形势,我们就可以进行依赖管理。
如何使用
(1)使用 添加js或者css库
pom.xml
<dependency> <groupId>org.webjars</groupId> <artifactId>bootstrap</artifactId> <version>3.3.7-1</version>
</dependency>
<dependency> <groupId>org.webjars</groupId> <artifactId>jquery</artifactId> <version>3.1.1</version>
</dependency>
src/main/resources/static/demo.html
<html> <head> <script src="/webjars/jquery/3.1.1/jquery.min.js"></script> <script src="/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js"></script> <title>WebJars Demo</title> <link rel="stylesheet" href="/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" /> </head> <body> <div class="container"><br/> <div class="alert alert-success"> <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a> Hello, <strong>WebJars!</strong> </div> </div> </body>
</html>
启动应用访问 http://localhost:8080/demo.html
(2)省略版本号
很少在代码中硬编码版本号,所以需要隐藏它
pom.xml添加webjars-locator
<dependency> <groupId>org.webjars</groupId> <artifactId>webjars-locator</artifactId> <version>0.31</version>
</dependency>
src/main/resources/static/demo.html
将
<script src="/webjars/jquery/3.1.1/jquery.min.js"></script>
<script src="/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js"></script>
<title>WebJars Demo</title>
<link rel="stylesheet" href="/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" />
改为
<script src="/webjars/jquery/jquery.min.js"></script>
<script src="/webjars/bootstrap/js/bootstrap.min.js"></script>
<title>WebJars Demo</title>
<link rel="stylesheet" href="/webjars/bootstrap/css/bootstrap.min.css" />
启动应用再次访问 http://localhost:8080/demo.html 结果和上边一样
扩展:
引入的开源JavaScript库/CSS库将会以jar的形式被打包进工程!
spring-boot-demo1-0.0.1-SNAPSHOT.jar\BOOT-INF\lib
bootstrap-3.3.7-1.jar
└─ META-INF └─ resources └─ webjars └─ bootstrap └─ 3.3.7-1 ├─ css | ├─ bootstrap.min.css | ├─ bootstrap.min.css.gz # Gzip文件 ...
jquery-3.1.1.jar
└─ META-INF └─ resources └─ webjars └─ jquery └─ 3.1.1 ├─ jquery.min.js ...
WebJars介绍及使用相关推荐
- WebJars——web端静态资源的jar包
1.WebJars介绍 Web前端使用了越来越多的JS或CSS,如jQuery,Backbone.js和Bootstrap.一般情况下,我们是将这些Web资源拷贝到Java Web项目的webapp相 ...
- websocket之 webjars的介绍
一.webjars的作用 1.1 介绍 WebJars是将web前端资源(js,css等)打成jar包文件,然后借助Maven工具,以jar包形式对web前端资源进行统一依赖管理,保证这些Web资源版 ...
- Spring Boot 框架介绍和使用
本文参考自Spring Boot文档. Spring Boot 简介 Spring框架功能很强大,但是就算是一个很简单的项目,我们也要配置很多东西.因此就有了Spring Boot框架,它的作用很简单 ...
- SpringBoot2-6 Web1-静态资源 默认4个目录,特别是resources 目录, webjars引入和内部资源访问,注意其内部resources目录 HandlerMapping
Web 帮助文档中专列了一个web目录 springboot是框架的框架,实现web仍然是spring mvc 创建一个web项目--基于java8 删除没用的 静态资源目录 /static (or ...
- Spring Boot中使用WebJars
1.WbeJars介绍 WebJars是将Web前端JQuery和Bootstrap等资源打包成Java的Jar包,这样在Java Web开发中我们可以借助Maven这些依赖库的管理. 项目中需要的J ...
- Maven介绍与应用
$文章作者:Tyan 博客:noahsnail.com | CSDN | 简书 1. Maven介绍 Maven这个单词来自于意第绪语(犹太语),意为知识的积累,最初在Jakata Turbi ...
- Themleaf模板基础语法使用介绍
Themleaf模板基础语法使用介绍 项目首页地址:https://blog.csdn.net/weixin_45019350/article/details/108869025 一. Thymele ...
- 【Springboot 入门培训】# 17 WebJars + BootStrap5 常用JS组件应用
在传统的前后一体项目开发中,大部分人会使用到BootStrap加其它JS组件的配合方式来完成页面UI功能的实现.下面介绍几种常用的JS库的使用方法.代码例子下载 目录 1 树形组件 1.1 TreeJ ...
- SpringBoot使用WebJars
本人主要做的是java,但是从第一份工作开始,就一直在做一个写前端又写后端的程序员,相信很多朋友和我一样,不仅要会后台代码,还要懂得很多的前端代码,例如javascipt和css样式. 本文就为大家简 ...
最新文章
- Data Protection Manager 2010 系列之安装部署
- 【GNN】谷歌、阿里、腾讯等在大规模图神经网络上必用的GNN加速算法
- 前端开发技巧-那些不常见但十分有效的小玩意
- 【转】c++ http下载文件
- 【终于等到你】7种策略解除云风险警报
- raft2020年更新_ECCV2020最佳论文解读之递归全对场变换(RAFT)光流计算模型
- NodeJS学习笔记之express
- mysql flaskalchemy_python flask sqlalchemy 数据库mysql操作
- vc中文件的读写操作
- 存储大师新作,三星存储四大新品面世!
- (笔记总结)串行通信接口标准
- 虚拟机装打印服务器,蜗牛矿渣装机教程 篇五:PVE虚拟机下OPENWRT如何安装USB打印机P1106...
- Mysql 超键 候选键 主键 外键之间关系
- 同时删除多个 PDF 文档前几页
- 【每日一题2019-11-14】-蓝桥杯 prev37 分巧克力
- 千寻位置 开发demo_从智能驾驶到智慧交通,看千寻位置如何助力未来“智”变...
- kibana discover查询语法
- 果园机器人能干什么_24* 果园机器人ppt配用优秀获奖教案
- Linux阿里云服务器Tomact从部署到放弃(踩坑系列)
- 怎样查删掉的通话记录
热门文章
- 李笑来~执行力WWH
- 学习python数据分析的30个练手数据+4个数据集网站
- 转:Win10秘笈:两种方式修改网卡物理地址(MAC)
- 使用java做mysql数据迁移时遇到的两个问题
- 高中学历,汽修转行自学Python,月薪翻了三倍【现在是一名Python数据分析师】
- 三步教会你旋转动画的制作
- 已知$g=14_则php表达式$h=$g+=10_运算后的结果是,【北语网院】19春《PHP》作业_2(100分)...
- 【Unity踩坑记录】导航系统NavMeshAgent
- JTAG各针脚的定义
- 心法利器[32] | 一些印象深刻的bad case