Question

我是构建系统的新手，所以我使用了Github的示例gulpfile作为我创建自己的gulpfile的指南（进行了一些修改）。它很成功，但是，最近，我注意到只要sass或js文件中出现一个错误，gulp就会显示一条错误消息并且服务器（browsersync服务器）会停止。

Gulpfile.js

'use strict';

const gulp = require('gulp');
const sass = require('gulp-sass');
const uglify = require('gulp-uglify');
const concat = require('gulp-concat');
const autoprefixer = require('gulp-autoprefixer');
const browserSync = require('browser-sync');

gulp.task('styles', () => {
  return gulp.src('assets/styles/sass/style.sass')
    .pipe(sass({outputStyle: 'compressed'}))
    .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
    .pipe(gulp.dest('assets/styles/'))
    .pipe(browserSync.stream());
});

gulp.task('scripts', () => {
    return gulp.src('assets/js/src/*.js')
        .pipe(concat('main.js'))
        .pipe(gulp.dest('assets/js/build'))
        .pipe(uglify())
        .pipe(gulp.dest('assets/js/'))
        .pipe(browserSync.stream());
});

gulp.task('serve', ['styles', 'scripts'], () => {
    browserSync.init({
        server: {
            baseDir: './'
        },
        notify: false
    });

    gulp.watch('assets/styles/sass/style.sass', ['styles']);
    gulp.watch('assets/js/src/*.js', ['scripts']);
    gulp.watch('index.html').on('change', browserSync.reload);
});

gulp.task('default', ['serve']);

我是否应该在styles任务中添加属性或方法？

Answer 1

大多数人似乎都使用gulp-plumber。我还会修改你的sass管道以包含错误报告ala

.pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))

如果您想查看有关sass错误的报告。最后，我会将'styles'和'scripts'中的browserSync.stream管道修改为：

.pipe(browserSync.reload({ stream:true }));

只要sass或js文件中出现任何错误，Gulp服务器就会停止

1 个答案: