Ninjaframework: Combining CSS and JS resources

Question

I'm evaluating ninjaframework. One important production feature that appears to be missing is the ability to combine CSS and Javascript resources for a production build. Is this supported by ninjaframework and if so are there examples available of configuration?

Answer 1

I found the WRO project which looks like it would work to fit this requirement using a standard Servlet filter:

https://github.com/wro4j/wro4j

Answer 2

I call out to gulp for this and have a variable that I set to indicate dev mode/prod mode in the FreeMarker template files. When in production I include the concatenated & minimised versions, and during development the regular files.

To every controller add this filter:

public class GlobalFilter implements Filter {
    @Inject
    NinjaProperties ninjaProperties;

    public Result filter(FilterChain chain, Context context) {
        Result result = chain.next(context);
        if (isHtmlTemplate(result)) {
            result.render("isDevMode", ninjaProperties.isDev());
        }

        return result;
    }
} 

And then in your base/default FreeMarker template you can include different CSS/JS files based on the dev/prod mode:

<#if isDevMode?? && isDevMode>
    <link rel="stylesheet" type="text/css" href="/assets/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="/assets/css/dataTables.bootstrap.css">
    <link rel="stylesheet" type="text/css" href="/assets/css/vis.css"/>

    <script src="/assets/js/jquery.js"></script>
    <script src="/assets/js/bootstrap.js"></script>
    <script src="/assets/js/jquery.dataTables.js"></script>
    <script src="/assets/js/moment.js"></script>
    <script src="/assets/js/vis.js"></script>
    <script src="/assets/js/dataTables.bootstrap.js"></script>

<#else>
    <link rel="stylesheet" type="text/css" href="/assets/css/main.min.css">

    <script src="/assets/js/main.min.js"></script>
</#if>