Question

我有一个充满haml和jade文件的目录树。如何使用grunt将整个结构编译成匹配的html目录树？

是否可以使用grunt watch将更改的文件编译到输出目录层次结构中的正确位置？

Answer 1

首先你需要安装grunt-haml2html（以前的grunt-contrib-haml）

npm install grunt-haml2html --save-dev

然后添加到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');

现在只有更改的文件才会编译

要使用grunt haml:main

编译整个文件夹

如何使用Grunt递归编译haml或jade的目录

1 个答案: