Loading bootstrap using webjars in spring boot application with multiple modules

Question

I have spring boot web application with multiple modules for frontend and backend. I need webjars dependency on the frontend module. So I added the following dependency on the frontend module.

<dependency>
        <groupId>org.webjars</groupId>
        <artifactId>bootstrap</artifactId>
        <version>4.5.0</version>
    </dependency>
    <dependency>
        <groupId>org.webjars</groupId>
        <artifactId>jquery</artifactId>
        <version>3.5.1</version>
    </dependency>
        <dependency>
        <groupId>org.webjars</groupId>
        <artifactId>webjars-locator</artifactId>
        <version>0.42</version>
    </dependency>

• header.html

<link th:rel="stylesheet" th:href="@{/webjars/bootstrap/css/bootstrap.min.css}"/>
<script th:src="@{/webjars/jquery/jquery.min.js}" type="text/javascript"></script>
<script th:src="@{/webjars/bootstrap/js/bootstrap.min.js}" type="text/javascript"></script>

<div th:fragment="html_header">
    <h1>This the header for all the pages</h1>
</div>

<div th:fragment="html_footer">
    <h1>This the footer for all the pages</h1>
</div>

    @Configuration
@EnableWebMvc
public class WebConfiguration implements WebMvcConfigurer {

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry
                .addResourceHandler("/webjars/**")
                .addResourceLocations("/webjars/");
    }
}

Even with these configurations I am unable to be bootstrap to the frontend. Can anyone suggest where I am doing wrong?

Answer 1

I am not sure if this is all you need, but you seem to be missing the version in your th:src path, those should probably be something like this (replace with your actual version numbers):

    <script th:src="@{/webjars/jquery/3.6.1/jquery.min.js}"></script>
    <script th:src="@{/webjars/bootstrap/3.4.1/js/bootstrap.min.js}"></script>

The same goes for whatever other webjars you might have. FYI, in my case I don't explicitly modify the resourceHandlers configuration to cover the webjars. Also, place the links in the header section of the main document.

Hopefully that is all you need.