仅渲染我使用 Assemble 更改的页面

Question

我一直在使用assemble 创建模式库。我有一个模式作为不同的文件，它们都内置到一个文件中。我还有一些页面是 HTML 的模板。

问题是，如果我在任何文件上更改一个东西，我必须等待整个文件被渲染，由于我拥有的页面数量，这最多需要 30 秒。正如您所想象的那样，这可能会令人沮丧，而我只是完成了项目的一半。

有谁知道让 Grunt 只渲染我更改的页面而不是所有页面的方法？

下面是我的 Gruntfile.js：

'use strict';

module.exports = function(grunt) {

// 1. All configuration goes here
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    concat: {
        dist: {
            src: [
                'vendor/jquery-ui/ui/core.js',
                'vendor/jquery-ui/ui/widget.js',
                'vendor/jquery-ui/ui/accordion.js',
                'vendor/jquery-ui/ui/datepicker.js',
                'javascript/slick/slick.js',
                'vendor/magnific-popup/dist/jquery.magnific-popup.min.js',
                'vendor/heapbox/src/jquery.heapbox-0.9.4.js',
                'vendor/jquery-waypoints/waypoints.js',
                'vendor/jquery-waypoints/shortcuts/sticky-elements/waypoints-sticky.js',
                'javascript/*.js'
            ],
            dest: 'public/javascript/scripts.js'
        }
    },

    uglify: {
        build: {
            src: 'public/javascript/scripts.js',
            dest: 'public/javascript/scripts.min.js'
        }
    },

    copy: {
        main: {
            src: [
                'vendor/jquery/dist/*.js',
                'vendor/prismjs/*',
                'vendor/bigSlide/**',
                'vendor/bigSlide/**',
                'vendor/magnific-popup/dist/*',
                'images/*'
            ],
            dest: 'public/'
        }
    },

    sass: {
        dist: {
            options: {
                style: 'compressed'
            },
            files: {
                'public/css/style.min.css': 'scss/style.scss'
            }
        },
        expanded: {
            options: {
                style: 'expanded'
            },
            files: {
                'public/css/style.css': 'scss/style.scss'
            }
        }
    },

    watch: {
        all: {
            files: ['*.hbs', 'patterns/*.hbs', 'layouts/*.hbs', 'templates/*.hbs'],
            tasks: ['assemble'],
            options: {
                spawn: false
            }
        },
        css: {
            files: ['scss/*.scss', 'scss/**/*.scss'],
            tasks: ['sass'],
            options: {
                spawn: false
            }
        },
        copy: {
            files: ['images/*', 'vendor/*', 'CHANGELOG'],
            tasks: ['copy'],
            options: {
                spawn: false
            }
        },
        concat: {
            files: ['javascript/*.js'],
            tasks: ['concat', 'uglify'],
            options: {
                spawn: false
            }
        }
    },

    assemble: {
        options: {
            flatten: false,
            plugins: ['assemble-middleware-permalinks'],
            partials: ['patterns/*.hbs'],
            helpers: ['handlebars-helper-compose', 'handlebars-helper-include' ],
            layoutdir: 'layouts',
            layout: 'library.hbs',
            data: ['templates/data/*.{json,yml}'],
            collections: [{
                name: 'patterns',
                inflection: 'pattern'
            }]
        },
        pages: {
            src: ['*.hbs', 'patterns/*.hbs', 'templates/*.hbs'],
            dest: 'public/'
        },
        patterns: {
            options: {
                layout: 'default.hbs'
            },
            files: {
                'public/': ['patterns/*.hbs']
            }
        },
        files: {
            options: {
                layout: 'default.hbs'
            },
            files: {
                'public/': ['templates/*.hbs']
            }
        }
    }

});

// 3. Where we tell Grunt we plan to use this plug-in.
grunt.loadNpmTasks('assemble');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-copy');

// 4. Where we tell Grunt what to do when we type "grunt" into the terminal.
grunt.registerTask('default', ['copy', 'assemble', 'sass', 'watch']);

};

有人可以帮忙吗？干杯。 史蒂夫

Answer 1

你试过了吗：https://www.npmjs.org/package/grunt-newer

它适用于两种类型的任务：

1) 指定 src 和 dest 文件的任务。在这种情况下，以 newer 为前缀的任务将被配置为使用比相应 dest 文件更新的 src 文件运行（基于文件的 mtime）。

2) 仅指定 src 文件的任务。在这种情况下，以 newer 为前缀的任务将被配置为使用比之前成功运行相同任务更新的 src 文件运行。