3

I am using springboot with thymeleaf to develop a website. The framework can load bootstrap css files cerrectly when not using uritemplating, but when I change to uritemplating then bootstrap css breaks.

This works perfectly

@GetMapping("/update_avatar")
public String update_avatar(){

    return "update_avatar";
}

This breaks css loading

@GetMapping("/update_avatar/{userid}")
public String update_avatar(@PathVariable String userid){

    System.out.println("Testing Variable: "+userid);
    return "update_avatar";
}

Here is how I include my stylesheet

<link rel="stylesheet" type="text/css"
      href="webjars/bootstrap/3.3.7/css/bootstrap.min.css" />

<link rel="stylesheet" th:href="@{/css/main.css}"/>
<link rel="stylesheet" th:href="@{/css/tutors.css}"/>

Please note that I included Bootstrap using maven by doing the following

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>bootstrap</artifactId>
    <version>3.3.7</version>
</dependency>

I tried to implement viewRsolver based on this solution but it did not work for me CSS not loading in Spring Boot

Mohale
  • 2,040
  • 3
  • 17
  • 18
  • Can you post your template code that includes the ` – Chris Thompson Jan 28 '18 at 17:25
  • I just included the snippets above, I used maven to include bootstrap in the project – Mohale Jan 28 '18 at 17:34
  • Got it, have you added the resource handler (#4) http://www.baeldung.com/maven-webjars ? – Chris Thompson Jan 28 '18 at 17:41
  • Let me take a look at the article. – Mohale Jan 28 '18 at 17:46
  • I just added resource handler, but I still can't have the problem solved. I also realised that it's all the css and js files that are not loading, it's not just bootstrap files. – Mohale Jan 28 '18 at 18:07
  • 1
    Just occurred to me that you likely need to change your `webjars` to be absolute: `/webjars` not `webjars`. For the others, have a look at the rendered HTML and confirm that the paths are correct (_e.g._ they're rendering ``) – Chris Thompson Jan 28 '18 at 19:17
  • Yeah... It actually works. This is weird because it works everything was working before I changed the URL to use URI templating. The only problem that is left is my stylesheet loading `main.css` and `tutors.css`, even though I made the changes you suggested – Mohale Jan 28 '18 at 19:26
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/164048/discussion-between-chris-thompson-and-mohale). – Chris Thompson Jan 28 '18 at 19:44

1 Answers1

0

Oh, I finally got it to work even though I do not have a detailed explanation as to why the code did not work. I had this @EnableWebMvc annotation in my resource configurations class, and it was the one messing up everything. I had taken the annotation from the example on this site so if you know what it means, please do help with an explanation.

I also added registry.addResourceHandler("/webjars/**").addResourceLocations("/webjars/"); to my resource configurations class as Chris had suggested above.

Mohale
  • 2,040
  • 3
  • 17
  • 18