ブラウザ同期でCSSを挿入する代わりにページをリロードする

Question

私の以前の問題が解決した後、今は別の問題に直面しています。私はファイル変更を監視するためにBrowsersyncを使用していますが、完璧に動作しますが、CSS変更を注入する代わりに、CSSファイルが変更されるたびにページ全体を再現します。

var elixir = require('laravel-elixir'); 
var gulp = require('gulp'); 

/* 
|-------------------------------------------------------------------------- 
| Elixir Asset Management 
|-------------------------------------------------------------------------- 
| 
| Elixir provides a clean, fluent API for defining some basic Gulp tasks 
| for your Laravel application. By default, we are compiling the Sass 
| file for our application, as well as publishing vendor resources. 
| 
*/ 

elixir(function(mix) { 
    mix.sass('comingsoon/soon.scss', 'public/assets/comingsoon/css/soon.css') 
     .scripts('comingsoon/soon.js', 'public/assets/comingsoon/js/soon.js') 
     .browserSync({ 
      files: [ 
       'app/*.*', 
       'app/**/*.*', 
       'public/assets/**/*.*' 
      ], 

      open: 'external', 
      proxy: 'gate7.dev:81', 
      host: 'gate7.dev', 
      port: 80, 
      notify: false 
    }); 
}); 

Answer 1

はそれを考え出した：

は、ここに私のgulpfileです。私はファイルの拡張子を特定しなければなりませんでした。

var elixir = require('laravel-elixir'); 
var gulp = require('gulp'); 

/* 
|-------------------------------------------------------------------------- 
| Elixir Asset Management 
|-------------------------------------------------------------------------- 
| 
| Elixir provides a clean, fluent API for defining some basic Gulp tasks 
| for your Laravel application. By default, we are compiling the Sass 
| file for our application, as well as publishing vendor resources. 
| 
*/ 

elixir(function(mix) { 
    mix.sass('comingsoon/soon.scss', 'public/assets/comingsoon/css/soon.css') 
     .scripts('comingsoon/soon.js', 'public/assets/comingsoon/js/soon.js') 
     .browserSync({ 
      files: [ 
       'app/*.*', 
       'app/**/*.*', 
       'public/assets/**/*.css', 
       'public/assets/**/*.js' 
      ], 

      open: 'external', 
      proxy: 'gate7.dev:81', 
      host: 'gate7.dev', 
      port: 80, 
      notify: false 
    }); 
});