Grunt:观察文件变化并编译父目录

Grunt: Watch file changes and compile parent directory

我正在使用 grunt 开发一个项目,我之前没有使用过 grunt,目前设置为监视文件,当文件被更改时重新编译所有文件(包含数百个文件的多个子目录) 在 html 中使用车把,这非常慢。我想通过只编译需要的东西来将其改进为更快的过程。

用 grunt newer 查看文件并没有真正起作用,因为目录中存在依赖关系,因此仅重新编译更改的文件不会产生有效页面。

我基本上需要重新编译已更改文件的整个父目录,但我不太确定我将如何配置类似的东西。

有什么我应该看的提示吗?

assemble本身是这样配置的:

 var _ = require('lodash');
 var path = require('path');
 // expand the data files and loop over each filepath
 var pages = _.flatten(_.map(grunt.file.expand('./src/**/*.json'), function(filepath) {
    // read in the data file
    var data = grunt.file.readJSON(filepath);
    var dest=path.dirname(filepath)+ '/' +path.basename(filepath, path.extname(filepath));
    dest=dest.replace("src/","");
    var hbs;
    if (data.hbs){
        hbs=grunt.file.read(path.dirname(filepath)+ '/' + data.hbs)
    }

    // create a 'page' object to add to the 'pages' collection
    return {
    // the filename will determine how the page is named later
    filename: dest,
    // the data from the json file
    data: data,
    // add the recipe template as the page content
    content:hbs 
    };
 }));

return {
    options: {
        /*postprocess: require('pretty'),*/
        marked: {sanitize: false},
        data: '<%= options.src %>/**/*.json',
        helpers: '<%= options.src %>/helpers/helper-*.js',
        layoutdir: '<%= options.src %>/templates',
        partials: ['<%= options.src %>/components/**/*.hbs']
    },
    build: {
        options: {
            layout: 'base.hbs',
            assets: '<%= options.build %>',
            pages: pages
        },
        files: [
            {
                cwd: '<%= options.src %>', 
                dest: '<%= options.build %>',
                src: '!*'
            }
        ]
    },
}

所以每次加载时,所有页面都会像 /src/sites/abc/xyz/foo.json 一样被扫描下来并进行编译,但我只想更改文件。 Watch 确实检测到更改的文件,但所有文件都被再次编译,我不确定我如何才能让 watch 在配置中识别的更改文件只处理部分文件。

我想你需要的东西已经在手表里了。

检查 g运行t 文档中的 Using the watch event

复制这里的内容以满足SO MODS/GODS.

当监视的文件被修改时,此任务将发出一个监视事件。如果您希望在编辑文件时收到简单的通知,或者如果您将此任务与其他任务结合使用,这将很有用。下面是一个使用 watch 事件的简单示例:

grunt.initConfig({
  watch: {
    scripts: {
      files: ['lib/*.js'],
    },
  },
});
grunt.event.on('watch', function(action, filepath, target) {
  grunt.log.writeln(target + ': ' + filepath + ' has ' + action);
});

watch 事件并非用于替换标准 G运行t API 用于配置和 运行ning 任务。如果您尝试 运行 从 watch 事件中执行任务,您很可能做错了。请阅读配置任务。

根据需要编译文件

一个很常见的要求是只编译需要的文件。这是一个仅使用 jshint 任务对更改的文件进行 lint 的示例:

grunt.initConfig({
  watch: {
    scripts: {
      files: ['lib/*.js'],
      tasks: ['jshint'],
      options: {
        spawn: false,
      },
    },
  },
  jshint: {
    all: {
      src: ['lib/*.js'],
    },
  },
});

// on watch events configure jshint:all to only run on changed file
grunt.event.on('watch', function(action, filepath) {
  grunt.config('jshint.all.src', filepath);
});

如果您需要动态修改您的配置,必须禁用 spawn 选项以使手表 运行保持在相同的上下文中。

如果您同时保存多个文件,您可以选择更可靠的方法:

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();
});