Gulp не уведомляет об ошибках JS и не компилирует файлы scss при запуске gulp

Question

Я пытался улучшить мой стандартный gulpfile, чтобы уведомлять, когда возникают ошибки при компиляции scss и JS.

SCSS Issue

У меня он работает для SCSS, он выдает ошибку в терминале, издает шум и не останавливает глоток - это здорово.

Странно, но мои стили компилировались при запуске gulp, но теперь мне нужно сохранить один из файлов.scss для запуска gulp (опять же, это хорошо, но я хочу, чтобы он компилировался при запуске gulp).

gulp
[12:07:06] Using gulpfile ~PATH/gulpfile.js
[12:07:06] Starting 'scripts'...
[12:07:06] Starting 'watch'...
[12:07:06] Finished 'watch' after 32 ms
[12:07:07] PATH/js/script-dist.js reloaded.
[12:07:07] Finished 'scripts' after 455 ms
[12:07:07] Starting 'default'...
[12:07:07] Finished 'default' after 15 μs

JS Issue

Я также пытаюсь уведомить об ошибках и о том, откуда именно они поступают для JS (а также не допустить остановки gulp при возникновении ошибки). Пробовал добавлять gulp-jshint, но это не похоже на работу. Он помечает ошибку как шум и т. Д., Но не сообщает мне, в каком из сцепленных файлов находится ошибка. Он просто говорит:

Error in plugin 'gulp-uglify'

Message:
    [_PATH_]/js/script-dist.js: Unexpected token keyword «var», expected punc «{»
Details:
    fileName: [_PATH_]/js/script-dist.js
    lineNumber: 3

Вот мой gulpfile.js

var gulp = require('gulp'); 

// --------------------------------------------------------------
// Plugins
// ---------------------------------------------------------------

var concat = require('gulp-concat');
var stripDebug = require('gulp-strip-debug');
var uglify = require('gulp-uglify');
var jshint = require('gulp-jshint');
var include = require('gulp-include');
var sass = require('gulp-sass');
var minifycss = require('gulp-minify-css');
var watch = require('gulp-watch');
var livereload = require('gulp-livereload');
var notify = require('gulp-notify');
var plumber = require('gulp-plumber');

// --------------------------------------------------------------
// JS
// ---------------------------------------------------------------

gulp.task('scripts', function() {
    return gulp.src(['./js/script.js'])
        .pipe(include())
        .pipe(plumber({errorHandler: errorScripts}))
        .pipe(concat('script-dist.js'))
        //.pipe(stripDebug())
        .pipe(jshint())
        .pipe(uglify())
        .pipe(gulp.dest('./js/'))
        .pipe(livereload());
});

// --------------------------------------------------------------
// Styles
// ---------------------------------------------------------------

gulp.task("styles", function(){
    return gulp.src("./ui/scss/styles.scss")
        .pipe(include())
        .pipe(plumber({errorHandler: errorStyles}))
        .pipe(sass({style: "compressed", noCache: true}))
        .pipe(minifycss())
        .pipe(gulp.dest("./ui/css/"))
        .pipe(livereload());
});


// --------------------------------------------------------------
// Errors
// ---------------------------------------------------------------

// Styles
function errorStyles(error){
    notify.onError({title: "SCSS Error", message: "Check your terminal", sound: "Sosumi"})(error); //Error Notification
    console.log(error.toString()); //Prints Error to Console
    this.emit("end"); //End function
};

// Scripts
function errorScripts(error){
    notify.onError({title: "JS Error", message: "Check your terminal", sound: "Sosumi"})(error); //Error Notification
    console.log(error.toString()); //Prints Error to Console
    this.emit("end"); //End function
};

// --------------------------------------------------------------
// Watch & Reload
// ---------------------------------------------------------------

gulp.task('watch', function() {   
    gulp.watch('./ui/scss/*.scss', ['styles']);
    gulp.watch(['./js/*.js', '!./js/script-dist.js'], ['scripts']);
});

gulp.task('default', ['styles', 'watch']);
gulp.task('default', ['scripts', 'watch']);

livereload.listen();

(Мой JS не велик, поэтому, пожалуйста, потерпите меня)

---

Обновить

Теперь мне удалось передать ошибку JS на терминал, но я не уверен, как сообщить, что это за ошибка на самом деле, из какого файла пришла ошибка и из какой строки? Очевидно, нужно заменить console.log некоторыми переменными, но вы не знаете, как этого добиться?

gulp.task('scripts', function() {
    return gulp.src(['./js/script.js'])
        .pipe(include())
        .pipe(plumber(
            //{errorHandler: errorScripts};
            function() {
                console.log('There was an issue compiling scripts');
                this.emit('end');
            }
        ))
        .pipe(concat('script-dist.js'))
        //.pipe(stripDebug())
        //.pipe(jshint())
        .pipe(uglify())
        .pipe(gulp.dest('./js/'))
        .pipe(livereload());
});

Answer 1

Стили не работает ответ:

Когда ты бежишь default задача, ваши стили не скомпилированы, потому что вы делаете это:

gulp.task('default', ['styles', 'watch']);
gulp.task('default', ['scripts', 'watch']);

В основном то, что вы делаете здесь, перезаписывает ваши default задание с новым.

Это можно легко преодолеть, комбинируя два:

gulp.task('default', ['scripts', 'styles', 'watch']);

Уведомление об ошибке в ответе консоли:

Вы должны выполнить jshinting перед объединением, иначе вы получите сообщение об ошибке в объединенном файле (script-dist.js). Вы должны изменить свой gulpfile на:

gulp.task('scripts', function() {
    return gulp.src(['./js/script.js'])
        .pipe(include())
        .pipe(plumber(
            //{errorHandler: errorScripts};
            function() {
                console.log('There was an issue compiling scripts');
                this.emit('end');
            }
        ))
        .pipe(jshint())
        .pipe(concat('script-dist.js'))
        .pipe(stripDebug())
        .pipe(uglify())
        .pipe(gulp.dest('./js/'))
        .pipe(livereload());
});

Это должно делать свое дело;-)