Grunt LiveReload 真的很慢答案

【问题标题】：Grunt LiveReload is really slowGrunt LiveReload 真的很慢
【发布时间】：2014-02-10 04:08:34
【问题描述】：

这可能是我的低效设置的影响，而不是 grunt/livereload 的问题。

这是我在 grunfile.js 中的手表测试：

watch: {
    images: {
        files: ['images/**/*.{png,jpg,gif}', 'images/*.{png,jpg,gif}'],
        tasks: ['imagemin'],
        options: {
            spawn: false
        }
    },
    js: {
        files: ['js/*.js','js/**/*.js'],
        tasks: ['jshint'],
        options: {
            spawn: false
        }
    },
    svgs: {
        files: ['images/*.svg','images/**/*.svg'],
        task: ['svgmin'],
        options: {
            span: false
        }
    },
    scss: {
        files: ['sass/*.scss', 'sass/**/*.scss'],
        tasks: ['sass','autoprefixer'],
        sourceComments: 'normal',
        options: {
            nospawn: true,
            livereload: true
        }
    }
},

这将重新编译我的 SASS 并重新加载页面，但完成 CSS 编译需要 5-6 秒，然后它会刷新整个页面，而不是仅仅重新加载更改的 CSS 文件。

所以我的问题是这样的：

如何避免花这么长时间编译 SASS 和刷新页面，或者我只是挑剔，这是 grunt 的继承部分？
如何避免重新加载整个页面，而只是重新加载从我的 SASS 编译中更改的 CSS 文件？

【问题讨论】：

github.com/sindresorhus/time-grunt 可以告诉您哪些任务花费的时间最多，并帮助您优化任务。

标签： css sass gruntjs

【解决方案1】：

查看我的其他答案：Fastest way to compile SCSS (Compass) + refresh the browser?

grunt-contrib-sass 使用的是非常慢的 Ruby sass，与 grunt 本身无关。

改用grunt-sass，它使用了libsass，它是sass的快速c实现。

阅读这篇文章： http://benfrain.com/lightning-fast-sass-compiling-with-libsass-node-sass-and-grunt-sass/

【讨论】：

【解决方案2】：

最好的解决方案是从 grunt-contrib-sass 转移到 grunt-sass，但如果你没有太多时间来解决这个问题，我认为，你应该将你的“autoprefixer”任务从 watch 部分移动到 deploy 部分.

scss: {
    files: ['sass/*.scss', 'sass/**/*.scss'],
    tasks: ['sass',
    sourceComments: 'normal',
    options: {
        nospawn: true,
        livereload: true
    }
}

在我的项目中，这个技巧对我有帮助，因为 'autoprefixer' 任务工作非常缓慢

【讨论】：

【解决方案3】：

或者您可以结合 ruby sass 编译器使用实时重新加载工具，例如 fast-live-reload。

请注意，他们提供自己的观察者，非常快（例如，对于指南针运行：compass watch）。

免责声明：我是 fast-live-reload 的创造者。

【讨论】：