8

SCSS をコンパイルしてブラウザを更新する最速の方法は何だと思いますか? 私は現在 LiveReload を使用していますが、少し遅いように見える場合があり、1 ～ 3 秒かかることがあります。たいしたことではないようですが、適切なコーディングのペースを失っているように感じます。

皆さんは何を使っていますか？CodeKit の方が速いでしょうか? それとも Sublime LiveReload プラグイン (実際のアプリではない) でしょうか? それとも、コンパスをあきらめて別のものを使うべきでしょうか? 任意の提案をいただければ幸いです。

PS。私はOS Xを使用しています

4

3 に答える 3

7

私はこのスタックを使用します：

注意事項

しかし、x100xxx の方がはるかに高速です...!

ここでもっと読む：

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

例

ページでライブ リロードを有効にするには、body 終了タグの前に script タグを追加します。

<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"]);
};
于 2014-01-05T16:18:25.147 に答える
3

fast-live-reloadを使用して正確にそれを行うことができ、そのすべての構成も必要ありません。これらの行に沿った何かがうまくいくと思います：

fast-live-reload -ep "compass watch" \ -s http://path-to-your-app/ \ dist/css/

これはcompass watch起動時に実行され、完了したら強制終了し、dist/css フォルダーが変更されるたびにページをリロードします。

これは、typescript のような他の外部ウォッチャーでもうまく機能するフローです。

免責事項: 私は fast-live-reload の作成者です。

于 2015-06-11T08:43:59.007 に答える