编译SCSS(Compass)的最快方法+刷新浏览器？

Question

只是想知道你认为什么是最快的方式来编译SCSS并刷新浏览器？我目前正在使用LiveReload,但有时似乎有点慢,可能需要1-3秒.它似乎并不多,但我觉得我正在失去正确的编码速度.

你们用的是什么？CodeKit会更快吗？或者Sublime LiveReload插件(不是实际的应用程序)？或许我应该放弃指南针并使用别的东西？任何建议,将不胜感激.

PS.我在OS X上

Answer 1

我用这个堆栈:

• gruntjs
• grunt-sass(通过node-sass而不是ruby sass 使用libsass)
• 咕噜-手表的contrib

注意事项

• 不支持Sass缩进语法.
• 指南针不受支持

但它更快x100xxx ......!

在这里阅读更多:

http://benfrain.com/lightning-fast-sass-compiling-with-libsass-node-sass-and-grunt-sass/

例

要在页面上启用实时重新加载,请在结束正文标记之前添加脚本标记:

<script src="//localhost:35729/livereload.js"></script>

这是Gruntfile.js的一个例子:

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON("package.json"),
    sass: {
      dist: {
        options: {
          outputStyle: "nested"
        },
        files: {
          "dist/css/app.css": "src/scss/app.scss"
        }
      }
    },
    watch: {
      options: {
        livereload: true
      },
      grunt: {
        files: ["Gruntfile.coffee"]
      },
      sass: {
        files: "src/scss/app.scss",
        tasks: ["sass"]
      }
    }
  });
  grunt.loadNpmTasks("grunt-sass");
  grunt.loadNpmTasks("grunt-contrib-watch");
  grunt.registerTask("build", ["sass"]);
  grunt.registerTask("default", ["build", "watch"]);
};