Static Resources with WebJars

Update your pom.xml dengan menambahkan webjars library contohnya seperti jQuery, Bootstrap, DataTables seperti berikut:

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
    <!-- project properties -->

    <properties>
    <!-- properties value -->
    </properties>

    <dependencies>
        <!-- other libs -->

        <!--webjars -->
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>bootstrap</artifactId>
            <version>4.5.2</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>jquery</artifactId>
            <version>3.5.1</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>jquery-validation</artifactId>
            <version>1.19.0</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>datatables</artifactId>
            <version>1.10.21</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>datatables-buttons</artifactId>
            <version>1.6.1</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>datatables-bootstrap</artifactId>
            <version>2-20120202-2</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>datatables-colreorder</artifactId>
            <version>1.5.1-1</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>datatables-responsive</artifactId>
            <version>2.2.3</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>datatables-rowreorder</artifactId>
            <version>1.2.4</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>datatables-fixedheader</artifactId>
            <version>3.1.7</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>datatables-fixedcolumns</artifactId>
            <version>3.2.2</version>
        </dependency>
        <dependency>
            <groupId>org.webjars</groupId>
            <artifactId>datatables-colvis</artifactId>
            <version>1.1.1</version>
        </dependency>
    </dependencies>
</project>

Sekarang kita akan coba untuk test, apakah resources yang kita tambahkan sudah bisa di access melalui web contohnya seperti resource bootstrap:4.5.2 yang kita tambahkan sebagai dependency coba access dengan url http://localhost:8080/bootcamp-java-webapp/webjars/bootstrap/4.5.2/css/bootstrap.min.js jika berhasil maka outputnya seperti berikut:

Setelah itu, kita bisa menggunakan di halaman html atau jsp contohnya seperti berikut:

Hasilnya seperti berikut:

Mungkin dari temen-temen bertanya? bang itu kok tau lokasi file css atau js. itu di ambil dari mana ya?

jawabanya: nih lokasinya ada di lib/dependency seperti berikut:

dan coba baca ini

Back to top ↑