CODEWITHSUNDEEP
gruntjspuggrunt-contrib-jade
dunika
dunika

Reputation: 220

Compile Jade to Relative Folder with Grunt

I am using grunt to compile my Jade files. My folder structure looks like this

-blocks
    -header
        -jade
            header.jade
        -html
    -nav
        ...

What I want to do is compile all the jade files for each block and then have the html files sent to their corresponding html folder. I've looked around but cant seem to find anything. I've relatively new to grunt so I'm still getting the hang of it. I'm thinking I may be able to achieve this using cwd somehow but I don't really understand how it works. I've put some code below which is untested /pseudo-ish

jade:{
    dist:{
        files:{
              src: "blocks/*/jade/*.jade", 
              dest: "html", 
              cwd: ?????? 
              ext: '.html'
             }
           }
       }

Upvotes: 0

Views: 31

Answers (1)

randominstanceOfLivingThing
randominstanceOfLivingThing

Reputation: 18672

There is no magic. I found that it concatenates all the jade files to a single html. So here is the solution I can up with:

var jadeDir = 'blocks/*/jade/';
var htmlSources = 'html';
var jadeTransforms = [];

//Read all the jade files and create a html file for each
//To create the jade files create a literal object with src, dest and ext for
 //each file
 var jadefiles = grunt.file.expand({cwd: jadeDir}, '*.jade');
 for (var i =0, len = jadefiles.length; i < len; i++) {
    var jadefile = jadefiles[i];
    jadeTransforms.push({
       src: jadeDir + jadefile,
       dest: htmlSources + jadefile.substring(0, jadefile.indexOf('.jade')) +  '.html',
       ext: "html"
   });
  }

.....

 // Here is my jade setup based on jadeTransforms
  jade:{
   dist:{
     files:jadeTransforms
   }
  }

Upvotes: 0

Related Questions