![Spring Boot 2实战之旅](https://wfqqreader-1252317822.image.myqcloud.com/cover/805/26542805/b_26542805.jpg)
上QQ阅读APP看书,第一时间看更新
3.6 使用WebJars
在开发的过程中,很多时候需要结合前端进行开发。本节将介绍Spring Boot框架整合WebJars进行前端静态JavaScript和CSS。
作为开发者,对Bootstrap和jQuery应该不会陌生。接下来我们将在Spring Boot项目中引入WebJars,对应二者的JAR进行使用,在pom文件中加入二者的依赖文件,如代码清单3-32所示。
![](https://epubservercos.yuewen.com/47855F/15056703904175906/epubprivate/OEBPS/Images/Figure-T48_80982.jpg?sign=1738895886-ptAjkLax0BMxatLdAWz6eqW2LZs3eIQn-0-1a1416e299acad1b3a0976da397fbbf5)
其实到这里整合完毕了,但是为了证实我们是否可以成功引用,在src/main/recources/static文件夹下新建index.html,在HTML中引入刚刚加入依赖的文件。index.html页面代码如代码清单3-33所示。
![](https://epubservercos.yuewen.com/47855F/15056703904175906/epubprivate/OEBPS/Images/Figure-T49_80983.jpg?sign=1738895886-5sq5PytMffS7KaU6tMN0bNydGrW4btGa-0-cb263e5a462ddfde0a7d03c36c555cc2)
在HTML页面中,我们分别对Bootstrap和jQuery进行了引用,使用Bootstrap对a标签进行了样式的修饰,使用jQuery在打开页面时利用告警输出了a标签的href值。启动项目,让我们来证实一下,在浏览器上访问http://localhost:8080,如图3-5所示。
如图3-5所示,可以看到之前的操作都实现了。其实WebJars还提供了很多其他的依赖,具体使用可以查看WebJars官网(官网地址:https://www.webjars.org/)。
![](https://epubservercos.yuewen.com/47855F/15056703904175906/epubprivate/OEBPS/Images/Figure-P50_79800.jpg?sign=1738895886-L8ptvh2D8VoqVl2Mu1VVOrcJPU6DP7rh-0-db80ac63040410bf8659fdb9f75d4674)
图3-5 WebJars项目访问效果图