如何有条件地编译（使用 Grunt）只更改了带有模板的翡翠文件包括

Question

使用grunt-contrib-watch 推荐的版本仅编译更改的文件在此处：https://github.com/gruntjs/grunt-contrib-watch#compiling-files-as-needed

var changedFiles = Object.create(null);

var onChange = grunt.util._.debounce(function() {
grunt.config('jshint.all.src', Object.keys(changedFiles));
   changedFiles = Object.create(null);
}, 200);

grunt.event.on('watch', function(action, filepath) {
   changedFiles[filepath] = action;
   onChange();
});

这很好用（我在这里写了一个变体：https://gist.github.com/pgilad/6897875）

问题是在 Jade 模板中使用 include 时，这意味着您正在包含其他 Jade 模板以构建完整的 html 文件。

使用单一解决方案进行编译不起作用，因为如果您正在处理的 .jade 文件是使用 include current_working_jade.jade 嵌入的 - 包含文件将不会被重新编译。

对于从头开始编译所有jade 文件除了是否有任何解决方法？当您每次要编译大约 60 个大的玉文件时，这会导致问题。

我能想到的唯一可能的解决方案是将jade模板依赖关系映射到外部或使用目录，但我不知道有什么工具/插件可以做到这一点......

Answer 1

在已经开始制作一个会生成一种玉的脚手架sourcemap 之后，我发现了这个很棒的项目，它已经解决了这个问题：

Jade Inheritance

用法如下：

1. 安装包使用：npm install jade-inheritance --save-dev

2. 你想从一个jade中获取依赖文件列表的地方：

   var JadeInheritance = require('jade-inheritance');

   var inheritance = new JadeInheritance(file, basedirname, {basedir:basedirname});

3. 那么当你要获取文件时：

   depenedentFiles = inheritance.files;

4. 该项目还演示了如何应用 grunt.watch 的概念，以便仅编译更改的 jade 文件及其依赖项，这正是我所需要的：

Using jade-inheritance with grunt watch

Answer 2

我想像检查所有的翡翠文件，如果它们包含您更改的文件，那么也重新编译它。应该不会太难。伪代码：

var allFiles = getAllJadeFileWithIncludesAndProjectPathMap();
//allFiles now contains something like this

{
  'jade/index.jade': ['jade/menu.jade', 'jade/home.jade'],
  'jade/about.jade': ['jade/menu.jade']
}


var rootFiles = [];

_.each(allFiles, function (includes, parent) {
  _.each(includes, function (includePath) {
    var parent;
    while (parent = getParentPath(includePath)) {
      //nothing needed if getParentPath returns null for files that aren't included
    }

    if (rootFiles.indexOf(parent) !== -1) {
      rootFiles.push(parent);
    }
  });
});

现在将这些文件添加到编译任务中。