CODEWITHSUNDEEP
gruntjsgrunt-contrib-watch
superluminary
superluminary

Reputation: 49172

How to use Grunt to recursively compile a directory of haml or jade

I have a directory tree full of haml and jade files. How do I use grunt to compile the whole structure into a matching directory tree of html?

Is it possible to use grunt watch to compile changed files into the correct location in the output directory hierarchy?

Upvotes: 0

Views: 545

Answers (1)

Jman
Jman

Reputation: 936

First you need to install grunt-haml2html (former grunt-contrib-haml)

npm install grunt-haml2html --save-dev

Then add to Gruntfile 

grunt.initConfig({
  haml: {
    main: {
      files : [
        { expand: true, cwd:'src', src: '**/*.haml', dest: 'dest', ext : '.html' }
      ]
    },
    watch: {
      files : {}
    }
  },
  watch: {
    haml: {
      files: '**/*.haml',
      tasks: ['haml:watch'],
      options: {
        spawn: false
      }
    }
  }
});

grunt.event.on('watch', function(action, filepath) {
  if(filepath.indexOf('.haml') === -1) return;
  var file = {};
  var destfile = filepath.replace('.haml','.html');
  file[destfile] = filepath
  grunt.config('haml.watch.files', file);
});

grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-haml2html');

Now only changed file will compile

To compile a whole folder use grunt haml:main

Upvotes: 1

Related Questions