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"
    }
}

4. gradle執行uploadArchives 即可完成webjar的製作
   
5. 使用發佈的自定義webjar
   gradle 向引入其他依賴一樣引入自定義的webjars

 implementation 'jhd.jcode:jcode-web-webjars:1.0'

6. 我們打的jar包目錄結構
   

大功告成！趕緊實現自己的webjars吧！