Question

我有一个小问题，因为几个小时后我就在打架。我想用gulp来观看scss文件，将它们转换为css然后重新加载浏览器。

直到重新加载浏览器才有效。所以sass正在使用gulp而不是Browsersync。这是我的gulpfile.js，也许有人可以帮忙吗？

var gulp = require('gulp');  
var sass = require('gulp-sass');  
var browserSync = require('browser-sync');

gulp.task('sass', function () {  
    gulp.src('webroot/css/style.scss')
        .pipe(sass({includePaths: ['scss']}))
        .pipe(gulp.dest('webroot/css'));
});

gulp.task('browser-sync', function() {  
    browserSync.init(["./**/*.css", "./**/*.php","./**/*.ctp","./**/*.js"], {
        server: {
            baseDir: "./",
            proxy:{target:'cake.dev', ws : true}
        },
        logLevel: "debug",
    });
});

gulp.task('default', ['sass', 'browser-sync'], function () {  
    gulp.watch("webroot/css/*.scss", ['sass']);
});

Ps：我正在与CAKEPHP 3合作。

Answer 1

所以你需要告诉browserSync在sass任务结束时重新加载：

safeObservable
    .flatMap {
        Requestor
            .makeUnsafeObservable()
            .catchErrorJustReturn(0)
    }
    .shareReplay(1)
    .subscribe()

Answer 2

我解决了它：

var gulp = require('gulp');  
var sass = require('gulp-sass');  
var browserSync = require('browser-sync');

gulp.task('sass', function () {  
    gulp.src('webroot/css/style.scss')
        .pipe(sass({includePaths: ['scss']}).on('error', sass.logError))
        .pipe(gulp.dest('webroot/css'));
});

gulp.task('browser-sync', function() {  
    browserSync.init(["webroot/css/*.css", "webroot/js/*.js"], {
        proxy   : "http://cake.dev/",
    });
});

gulp.task('default', ['sass', 'browser-sync'], function () {  
    gulp.watch("webroot/css/*.scss", ['sass']);
});

您不必在browserSync init中使用服务器{// ...}，因为这是为了创建服务器。相反，如果你在wamp上，你必须使用简单的代理...（如果你有一个虚拟主机，你必须修改它并将“require local”替换为“require all granted”，我认为......）。

如果您在编写scss并保存时出错，则“on error”条件是不会停止程序。

所以你可以犯错误，但你有责任去了解它。

谢谢大家。希望有一天能帮到别人。

Browsersync不会在wamp上刷新

2 个答案: