没有sss的Browsersync?

时间:2018-07-23 22:27:35

标签: sass gulp gulp-sass livereload gulp-browser-sync

我是gulp的新手,我正尝试在没有scss的情况下设置browsersync。我所见过的所有示例都将其设置为用于预处理sass。如何设置它以观看普通CSS?这是我的gulpfile.js:

const gulp = require('gulp'),
browserSync = require('browser-sync').create(),
sass = require('gulp-sass');


// Static server & watch scss + html files
gulp.task('watch', ['sass'], function() {

browserSync.init({
server: '.'
});

gulp.watch('./assets/**/*.scss', ['sass'], browserSync.reload);
gulp.watch('./*.html').on('change', browserSync.reload);
gulp.watch('./js/**/*.js', browserSync.reload);

});

// Compile Sass into CSS & inject into browsers
gulp.task('sass', function() {
return gulp.src('./assets/**/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(gulp.dest('./css'))
.pipe(browserSync.stream());
});


// default will also watch
gulp.task('default', ['watch']);

1 个答案:

答案 0 :(得分:0)

尝试以下代码块。它为我工作。我认为sass = require('gulp-sass')并不是必需的。

const gulp = require('gulp'),
browserSync = require('browser-sync').create(),
sass = require('gulp-sass');


// Static server & watch scss + html files
gulp.task('watch', function() {

browserSync.init({
server: '.'
});

gulp.watch('./assets/*.css', browserSync.reload);
gulp.watch('./*.html').on('change', browserSync.reload);
gulp.watch('./js/*.js', browserSync.reload);

});


// default will also watch
gulp.task('default', ['watch']);