Question

当我运行time sassc app.scss app.css时，编译时间非常快： sassc是libsass库上C实现的命令行包装器。

real    __0m0.132s__
user    0m0.123s
sys 0m0.007s

但是，对grunt-sass使用Node.js libsass包装时，在我的Gruntfile.js内，输出速度慢得多：

Running "watch" task
Waiting...
File "stylesheets/sass/app.scss" changed.
Running "sass:compile" (sass) task
File ./stylesheets/app.css created.

Done, without errors.
Completed in __1.759s__ at Sat May 24 2014 18:17:33 GMT+0200 (CEST) - Waiting...

以下是我Gruntfile.js的相关部分，也许我在这里做错了：

module.exports = function(grunt) {

    grunt.initConfig({

        project: {
            app: '.',
            sheets: '<%= project.app %>/stylesheets',
            sass: [ '<%= project.sheets %>/sass/app.scss',
            ],
            js: [],
        },
        // The watch task is used to run tasks in response to file changes
        watch: {
            options: {
                livereload: true,
            },
            html: {
                files: ['<%= project.app %>/*.html'],
            },
            css: {
                files: ['<%= project.sheets %>/*.css'],
            },
            sass: {
                files: '<%= project.sheets %>/sass/{,*/}*.{scss,sass}',
                tasks: ['sass:compile'],
                options: {
                    livereload: false,
                },
            },

        },
        sass: {
            compile: {
                options: {
                    style: 'nested',
                },

                files: {
                    '<%= project.sheets %>/app.css' : '<%= project.sheets %>/sass/app.scss',
                }
            }
        },

    }); // The end of grunt.initConfig

    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-sass');

    grunt.registerTask('preview', ['watch', ]);
};

为什么我在Grunt中获得如此缓慢的编译时间？

Answer 1

我真的不知道这是否会对您有所帮助，但当我遇到类似问题时，我发现源代码生成（默认情况下启用）会降低编译时间。

启用源映射：

$ time grunt sass:dev
grunt sass:dev  12,44s user 0,19s system 100% cpu 12,618 total

禁用源映射：

$ time grunt sass:dev
grunt sass:dev  4,57s user 0,17s system 98% cpu 4,800 total

要停用源地图，只需添加sourcemap选项并将其值更改为＆＃39;无＆＃39;：

sass: {
    compile: {
        options: {
            style: 'nested',
            sourcemap: 'none',
        },

        files: {
            '<%= project.sheets %>/app.css' : '<%= project.sheets %>/sass/app.scss',
        }
    }
},

参考：grunt-contrib-sass sourcemap

Answer 2

查看time-grunt您应该包含哪些内容来衡量您的sass任务的实际时间。

它可能与监视任务有关，具有咕噜声启动时间或其他内容。因此，看看测量时间来自何处以及泄漏位置将是有趣的。

Grunt使用grunt-sass（libsass包装器），编译时间慢

2 个答案:

启用源映射：

禁用源映射：