springboot项目通过gradle制作webjars

什么是webjars?

Web前端使用了越来越多的JS或CSS,如jQuery,Backbone.js和Bootstrap。一般情况下,我们是将这些Web资源拷贝到Java Web项目的webapp相应目录下进行管理。这种通过人工方式管理可能会产生版本误差,拷贝版本错误,漏拷等现象,导致前端页面无法正确展示,版本不一致,文件混乱等,导致出现一些莫名其妙的错误等。

WebJars是将web前端资源(js,css等)打成jar包文件,然后借助Maven工具,以jar包形式对web前端资源进行统一依赖管理,保证这些Web资源版本唯一性。WebJars的jar包部署在Maven中央仓库上。

WebJars官网:http://www.webjars.org/

通过gradle引入webjars依赖

dependencies {
    // https://mvnrepository.com/artifact/org.webjars/jquery
    implementation 'org.webjars:jquery:1.12.4'
}

引入后,jquery webjars的结构
在这里插入图片描述

使用

html中直接使用

<script src="/webjars/jquery/1.12.4/jquery.min.js"></script>

原理

springboot的自动装配帮我们配置好了webjars的映射

https://www.webjars.org/documentation#springboot
Spring Boot automatically configures Spring to map requests for /webjars to the /META-INF/resources/webjars directory of all the JARs in the CLASSPATH.

Idea中按住ctrl+shift+F/META-INF/resources/webjars进行全局搜索
在这里插入图片描述

WebMvcAutoConfiguration.class帮我们配置好了,所以可以直接访问**/webjars/目录就能获取项目/META-INF/resources/webjars的资源文件,包括jar包中的资源;
所以我们只需要将这些资源打包到
/META-INF/resources/webjars**目录下就能通过引入jar包的方式使用静态资源了,方便了版本管理;

maven制作webjars

官网有很详细的说明,请参考官网吧

https://www.webjars.org/contributing

通过gradle制作webjars并发布到本地

  1. Idea中用gradle新建java moudle
  2. 我们将用到的静态资源放在/src/main/resources/webjars中
    在这里插入图片描述
  3. build.gradle文件内容
plugins {
    id 'java'
    id 'maven'
}

group 'jhd.jcode'
version '1.0'

sourceCompatibility = 1.8

repositories {
    mavenCentral()
}

//打包webjar,发布到本地
uploadArchives {
    repositories.mavenDeployer {
        repository(url: 'file://I:/DEV/jhdMvnRepo/')
    }
}

processResources {
    //将webjars目录整个拷贝到build目录下的/resources/main/META-INF/resources/webjars
    copy {
        from("src/main/resources/webjars") {
            eachFile {
                println(getPath())
            }
        }
        into "$buildDir/resources/main/META-INF/resources/webjars"
        println("processResources: webjars copy success( created by jhd 20200620 16:19)")
    }
}

jar {
    //打jar包之前先将build目录中原来的webjars文件删除
    doFirst {
        delete "$buildDir/resources/main/webjars"
    }
}
  1. gradle执行uploadArchives 即可完成webjar的制作
    在这里插入图片描述
  2. 使用发布的自定义webjar
    gradle 向引入其他依赖一样引入自定义的webjars
 implementation 'jhd.jcode:jcode-web-webjars:1.0'
  1. 我们打的jar包目录结构
    在这里插入图片描述

大功告成!赶紧实现自己的webjars吧!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章