Search code examples
twitter-bootstrapfontswicketglyphiconswebjars

How to mount Glyphicon fonts from WebJars in Wicket

Using wicket-bootstrap-core and wicket-bootstrap-less (both version 0.10.5), I have successfully integrated Bootstrap into my Wicket 7 project. The set up is performed in the method

private void initBootstrap() {
  WicketWebjars.install(this);

  BootstrapSettings settings = new BootstrapSettings();
  settings.setThemeProvider(new SingleThemeProvider(new MyTheme()));

  Bootstrap.install(this, settings);
  BootstrapLess.install(this);
}

The theme class MyTheme refers to the LESS file theme.less. In this file (which compiles successfully), Bootstrap and the Glyphicons are imported using the directives

@import "webjars!bootstrap/current/less/bootstrap.less";
@import "webjars!bootstrap/current/less/glyphicons.less";

The only problem is that when I use any of the Glyphicons in my markup, this causes requests for the font files to be downloaded at path http://localhost:8080/myproject/wicket/resource/fonts/glyphicons-halflings-regular.woff2 (same with other extensions). Since no resource is mounted using a class named fonts, this results in

21:36:35.298 [tomcat-http--31] WARN  o.a.w.c.u.l.WicketObjects - Could not resolve class [fonts]
java.lang.ClassNotFoundException: fonts
        [stack trace omitted]

The question therefore is: How do I get these resources correctly mounted? From this I get the impression that the mounting should be automatic, and from this I furthermore get the impression that this should be a no-brainer.

Solution

  • After some further thinking, I came up with the following solution: Add the line

    @icon-font-path: '../de.agilecoders.wicket.webjars.request.resource.IWebjarsResourceReference/webjars/bootstrap/current/fonts/';

    to theme.less such that the icon URLs point to a location where the files are already mounted.

    While this solution actually works, I really hope that there is a less hideous way.