Adding Javascript or CSS using a Resource

A quick howto on adding Javascript or CSS to your pages, and having them compressed during the "deployment" cycle automatically by Wicket. So to start with, we need to copy or Javascript or CSS file somewhere in our package hierarchy that we can reference in our Page. For simplicity, we can copy it right next to the HTML file like so:

MyPage.java
MyPage.html
MyPage.js
MyPage.css

Then in our Page, we need to reference these items based on the path of our Java file, like so:

private static final CompressedResourceReference MYPAGE_JS = new CompressedResourceReference(MyPage.class, "MyPage.js");

private static final CompressedResourceReference MYPAGE_CSS = new CompressedResourceReference(MyPage.class, "MyPage.css");

This code gives us a ResourceReference that we can add to our page, most use cases to the HTML head element block. To do that in your page:

add(HeaderContributor.forJavaScript( MYPAGE_JS ));

add(HeaderContributor.forCss( MYPAGE_CSS ));

In Wicket 1.4 HeaderContributor.forJavaScript() is deprecated, you can use this:

add(JavascriptPackageResource.getHeaderContribution(BASEPAGE_JS));

add(JavascriptPackageResource.getHeaderContribution(MYPAGE_CSS));