CSS @import statement

Question

I'm currently using the Initializr generated Bootstrap enhanced version of the HTML5 Boilerplate which also includes the LESS framework.

Now the style.less is being included by the following line:

<link rel="stylesheet/less" href="${resource(dir: 'less', file: 'style.less') }">

This works, but the line @import('bootstrap/bootstrap.less') fails, because it cannot find the bootstrap.less file in /static/less/bootstrap/bootstrap.less. However, the file is available without the static part.

Is there something I need to tell Grails to put the not directly in a GSP page referenced files (what kind they may be of) in the right directory, i.e. static?

I found an issue regarding this problem: http://jira.grails.org/browse/GPRESOURCES-135 - this is telling me, that it has been fixed in version 1.2, I am currently using 2.0.2.

What do I have to do, to make this work?

Answer 1

I installed the lesscss-resources plugin which precompiles LESS files. This way, I can also use the @import statements.

I have defined my core stylesheets as a module in ApplicationConfig.groovy.

modules = {

    // ...

    sitecore {      
        dependsOn 'jquery'

        resource url:'less/style.less', attrs:[rel: "stylesheet/less", type:'css'], bundle:'bundle_sitecore'
        resource url:'js/main.js'
    }

And by doing so, I can just reference it using the Resources plugin of Grails:

<r:require module="sitecore" />