1

最新の gulp sass と browsersync を使用しています。scss ファイルを編集して保存すると、コンパイルされて「injecting styles.css」表示されますが、ブラウザもリロードされます。

これがいつ変更されるかはわかりませんが、以前はリロードせずに新しい css ファイルを挿入するだけでした。

私の仕事:

var sassFiles = './app/assets/sass/**/*.{scss,sass}';
var cssFiles = './app/assets/css';
var cssBuildFiles = './build/assets/css';

var sassOptions = {
  errLogToConsole: true,
  outputStyle: 'compact'
};

var autoprefixerOptions = {
  browsers: ['last 2 versions']
};


  gulp.task('sass', function () {
  return gulp
    .src(sassFiles)
    .pipe(sourcemaps.init())
    .pipe(sass(sassOptions).on('error', sass.logError))
    .pipe(autoprefixer(autoprefixerOptions))
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest(cssFiles))
    .pipe(browserSync.stream());
});

マップファイルがリロードをトリガーしていると誰かが私に言ったので、フィルターを使用して css ファイルのみを browsersync にパイプしました。ほとんどのオンラインの例はここにあるようなものなので、本当にそれを行う必要があるかどうかはわかりません...

4

1 に答える 1