在现在很多大型公司很多都前后端分离开发,而前端也是独立启动的,但是也有很多公司直接是独立的一个项目,前端页面直接在java程序当中,应对与这种独立项目我们可以采用springboot给我们提供的依赖形式来引入前端包,也挺方便的,需要的朋友们下面随着小编来一起学习学习吧。


目录

  • 简单了解其原理
  • 用法详解
  • 总结


个人感觉这个是有必要了解的,有的公司他确实就是这么在引用,假如你刚进公司不了解这个也挺尴尬的哈,本篇文章主要讲解webjars,以jar包的方式引入静态资源;


springboot框架前端界面 springboot集成前端框架_java


简单了解其原理

以下是springboot配置的mvc,他配置的springmvc相关配置都存在WebMvcAutoConfiguration这个类下,其中就包含了以下内容。

所有自动配置包都包含在这个jar包当中,想要了解springboot为我们配置的默认值,我们可以去以下包找。


springboot框架前端界面 springboot集成前端框架_springboot框架前端界面_02

springboot框架前端界面 springboot集成前端框架_java_03

从这个配置当中我们可以提取到关键信息:所有 /webjars/** ,都去 classpath:/META-INF/resources/webjars/ 找资源;


springboot框架前端界面 springboot集成前端框架_springboot框架前端界面_04

用法详解

1、引入依赖

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>jquery</artifactId>
    <version>3.5.1</version>
</dependency>

jar包依赖官网: http://www.webjars.org/.


springboot框架前端界面 springboot集成前端框架_spring_05

2、观察结构

我们观察添加完依赖的jar包结构,会发现他和springboot配置的mvc当中上面的配置正好衔接到一块。
这也正是他配置的classpath:/META-INF/resources/webjars/去这个地方找资源的原因。


springboot框架前端界面 springboot集成前端框架_springboot框架前端界面_06

3、项目引用

springboot给我们配置好了映射,我们直接访问

localhost:8080/webjars/jquery/3.5.1/jquery.js

这个时候会发现他是可以直接访问的


springboot框架前端界面 springboot集成前端框架_springboot框架前端界面_07

代码当中直接引用即可:

<script type="text/javascript" src="/webjars/jquery/3.5.1/jquery.js"></script>

总结

有些知识并不一定能用得到,在很多情况的时候,我们只需要知道有这个东西就行了,当真正用到的时候,我们最起码知道有个这么个东西,然后再去找文档看,然后来使用即可。当然这是我个人学习的方式,我的脑子有限,不可能什么都记得住。不知道你们是否跟我一样呢