12

I have a spring boot (I use Thymeleaf for templating) project where I want to use some jQuery libraries.

Unfortunately, the webjars aren't loading at all. I have tried many configuration but all of them failed.

Here is the code snippet of my HTML page:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">

<title>JAC</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

<script src="http://cdn.jsdelivr.net/webjars/jquery/2.1.4/jquery.js"
        th:src="@{/webjars/jquery/2.1.4/jquery.min.js}" type="text/javascript"></script>
<script src="http://cdn.jsdelivr.net/webjars/jquery-file-upload/9.10.1/jquery.fileupload.js"  type="text/javascript"
        th:src="@{/webjars/jquery-file-upload/9.10.1/jquery.fileupload.min.js}"></script>
<link href="http://cdn.jsdelivr.net/webjars/bootstrap/3.3.5/css/bootstrap.min.css"
      th:href="@{/webjars/bootstrap/3.3.5/css/bootstrap.min.css}"
      rel="stylesheet" media="screen" />
<link href="http://cdn.jsdelivr.net/webjars/jquery-file-upload/9.10.1/jquery.fileupload.css"
      rel="stylesheet" media="screen" />
</head>

I have added them in the pom file:

<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>jquery</artifactId>
    <version>2.1.4</version>
</dependency>
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>bootstrap</artifactId>
    <version>3.3.5</version>
</dependency>

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>jquery-file-upload</artifactId>
    <version>9.10.1</version>
</dependency>

But when calling the page I got a 404 on jquery.min.js and jquery.fileupload.min.js.

GET http://localhost:8888/webjars/jquery-file-upload/9.10.1/jquery.fileupload.min.js 
2015-09-21 02:02:04.059 home:9 
GET http://localhost:8888/webjars/jquery/2.1.4/jquery.min.js 404 (Not Found)
ROMANIA_engineer
  • 54,432
  • 29
  • 203
  • 199
Master Mind
  • 3,014
  • 4
  • 32
  • 63

8 Answers8

26

You are referencing jquery library correctly. Maybe you are missing resource handler configuration.

<mvc:resources mapping="/webjars/**" location="classpath:/META-INF/resources/webjars/"/>

Or if you use JavaConfig

@Configuration
public class WebConfig extends WebMvcConfigurerAdapter {

  @Override
  public void addResourceHandlers(ResourceHandlerRegistry registry) {
    registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");
  }

}

Webjars documentation

If this will not work, please check if you have webjars on classpath (open your application JAR in 7Zip and check if webjars resources are inside it.)

Gondy
  • 4,925
  • 4
  • 40
  • 46
  • I had the same issue so, adding – NNikN Jan 10 '16 at 19:52
  • 2
    @EnableWebMvc Should not be used for a Spring Boot application. It may cause issue if you use Swagger UI. Source -> https://springfox.github.io/springfox/docs/current/ (section 5.5) – Anand Jul 05 '16 at 09:00
  • 1
    Yes, it's not needed in spring boot app. Normally you would add @EnableWebMvc for a Spring MVC app, but Spring Boot adds it automatically when it sees *spring-webmvc* on the classpath. This flags the application as a web application and activates key behaviors such as setting up a DispatcherServlet. – Gondy Jul 06 '16 at 08:03
  • It is a bit odd that you don't need this resource mapping when starting the webapp as a spring-boot jar. It's only needed when running it in a .war file deployed to an application server. – Rüdiger Schulz Dec 02 '16 at 10:45
  • @mindhaq that is because Spring Boot automatically adds webjars resource handler. – Gondy Dec 02 '16 at 14:17
  • I think Spring Boot should do that as well if run as a war. – Rüdiger Schulz Dec 02 '16 at 14:26
  • @Gondy Are you saying that the WebJars resource handler is mandatory when deploying to an external application server, even when `EnableAutoConfiguration` annotation is present? I'm assuming that's what you mean when you say that Spring Boot "automatically adds webjars resource handler." If so, that is not the behavior that I have seen, so I'm trying to clarify my understanding of this issue. – Charles Jul 12 '17 at 15:27
  • @Charles it dependes on version of Spring Boot. In recent versions, webjars handler is added automatically. Check http://docs.spring.io/spring-boot/docs/1.5.3.RELEASE/reference/htmlsingle/ .But it was not in older versions. – Gondy Jul 13 '17 at 07:39
  • Do you know from which version it began to be handlers automatically? Also, which section of the documentation are referencing specifically? The main reference to WebJars is in the "Static Content" section but I do not see that it says you need to manually add WebJars handler for deploying to external server. – Charles Jul 13 '17 at 13:32
  • 2
    @mindhaq Can you please cite the Spring Boot documentation that states that you don't need this resource mapping when starting as a Spring Boot JAR, and that it's only needed when deploying to an external server? I haven't been able to find any mention of this other than your comment. – Charles Jul 13 '17 at 13:47
  • I don't have experience deploying Spring Boot to external server. (as WAR probably). You need to check it yourself. Just run application and search in logs for this: `o.s.w.s.h.SimpleUrlHandlerMapping : Mapped URL path [/webjars/**] onto handler of type [class org.springframework.web.servlet.resource.ResourceHttpRequestHandler]` If you found it, it works. – Gondy Jul 13 '17 at 14:47
  • @Charles This was not taken from documentation, but from observation. Sadly, I don't have access to the project anymore. – Rüdiger Schulz Jul 13 '17 at 23:50
  • Hey all, I had the same issue, had everything else, but added @EnableWebMvc and suddenly everything worked.... I keep hearing that SpringBoot does things automagically but it never seems to work and I end up spending hours tracking down things that would have taken less time to just implement. – Dan Chase Sep 24 '17 at 00:09
  • According to WebJars documentation: "Following the Spring MVC instructions in a Spring Boot project will result in disabling the static content mapping configured by Spring Boot." https://www.webjars.org/documentation#springboot It does not recommend adding a Resource Handler for webjars. – MrJohnBBQ Jan 28 '19 at 04:31
  • I had the same problem. I was able to solve it by removing some old `catalina.properties` and using the default `catalina.properties` from tomcat. It is worth to check `tomcat.util.scan.StandardJarScanFilter.jarsToSkip` or `tomcat.util.scan.StandardJarScanFilter.jarsToScan` if something is not working as expected. – pnbecker Nov 25 '21 at 09:23
5

After inspecting the webjar for jquery, I got this working by adding a "dist" subpath.

<script src="webjars/jquery/2.1.4/dist/jquery.min.js" type="text/javascript"></script>
4

Additional answer found on one blog:

When using Spring Framework version 4.2 or higher, it will automatically detect the webjars-locator library on the classpath and use it to automatically resolve the version of any WebJars assets.

In order to enable this feature, we’ll add the webjars-locator library as a dependency of the application:

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>webjars-locator</artifactId>
    <version>0.30</version>
</dependency>

In this case, we can reference the WebJars assets without using the version; (...)

2

if you use servlet 3.x just add :

1- using java config :

@Configuration
@EnableWebMvc
public class WebConfig extends WebMvcConfigurerAdapter {

    public void addResourceHandlers(ResourceHandlerRegistry registry) {

            registry.addResourceHandler("/webjars/**").addResourceLocations("/webjars/").resourceChain(false);

       registry.setOrder(1);
    }


}

2- or xml config :

<mvc:resources mapping="/webjars/**" location="/webjars/"> 
  <mvc:resource-chain resource-cache="false" /> 
</mvc:resources>
يعقوب
  • 1,008
  • 13
  • 14
1

The webjars dependencies should be available on the spring boot classpath, so you should try referencing the webjars using the src attribute like so:

<script src="webjars/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>
<script src="webjars/jquery-file-upload/9.10.1/jquery.fileupload.min.js"></script>
<link href="webjars/bootstrap/3.3.5/css/bootstrap.min.css"
  rel="stylesheet" media="screen" />
<link href="webjars/jquery-file-upload/9.10.1/jquery.fileupload.css"
  rel="stylesheet" media="screen" />
marminto
  • 33
  • 5
  • 1
    It doesn't work. In fact ,the css are loaded but the js libraries not i have checked they are both in the classpath but obviously there something wrong. – Master Mind Sep 21 '15 at 01:04
  • I'd add a `/` in front. This [sample project](https://github.com/snicoll-demos/spring-boot-4tw) used at a presentation at SpringOne showcases that. It also [showcases how you can remove the version from the URL](https://github.com/snicoll-demos/spring-boot-4tw/commit/4c75a4202aee4e22b0b68b814048ac96fe3ef289#diff-46d12e335211f179710b6dfcc8ea9319R9) using the Spring MVC resource chain – Stephane Nicoll Sep 21 '15 at 08:51
1

I ended up doing a mvn clean install (from cmd prompt) to get the target cleaned and all the lib/jars populated correctly. I am using Spring boot with Intelij.

Ajay Menon
  • 127
  • 6
0

After inspecting the webjars for jquery, I got this working by adding a "THE VERSION OF JQUERY LIBRARY USED IN POM.XML FILE"

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

(in my case I used 3.1.0 version, used that version only that you are using).

0

Make sure if you have updated the version of bootstrap or jquery when you are adding the dependencies, you should update the URL's in the jsp's or html's with the correct version of bootstrap and jquery.

AAA
  • 35
  • 2
  • 12