Gulp看不看.js文件

Question

刚刚回到一个非常旧的项目并更新到 Gulp 4.0.2。

设法让它监视和编译 css，但似乎没有监视对 JavaScript 文件的更改？

它不会抛出任何错误，只是在我进行更改时不会编译 JS。

（我是一名设计师，我的 JS 很糟糕，所以你可能不得不为我拼写出来）

gulpfile.js

// Include gulp
var gulp = require('gulp');

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

var concat          = require('gulp-concat');
var include         = require('gulp-include');
var jshint          = require('gulp-jshint');
var map             = require('map-stream');

var notify          = require('gulp-notify');
var plumber         = require('gulp-plumber');

var postcss         = require('gulp-postcss');
var sass            = require('gulp-sass');
var cssnano         = require('gulp-cssnano');
var autoprefixer    = require('autoprefixer');
var replace         = require('gulp-replace');

var fs              = require('fs');
var path            = require('path');

var stripDebug      = require('gulp-strip-debug');
var uglify          = require('gulp-uglify');
var watch           = require('gulp-watch');


// --------------------------------------------------------------
// Paths
// ---------------------------------------------------------------

var base = path.join(__dirname, '/site/themes/theme_name/');

var basePaths  = {
  src:       base + 'src/'
};

var paths = {
  styles: {
      src:    basePaths.src  + 'styles/',
      dist:   base           + 'css/'
  },
  scripts: {
      src:    basePaths.src  + 'scripts/custom/',
      dist:   base           + 'js/'
  },
  vendor: {
      src:    basePaths.src  + 'scripts/vendor/',
      dist:   base           + 'js/'
  }
};


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

gulp.task('styles', function() {
   return gulp.src(paths.styles.src + 'styles.scss')
      .pipe(include())
      .pipe(plumber({errorHandler: errorStyles}))
      .pipe(sass({style: "compressed", noCache: true}))
      .pipe(cssnano({
        autoprefixer: {browsers: ['> 0%', 'last 2 versions', 'Firefox >= 20'], add: true}
      }))
      .pipe(gulp.dest(paths.styles.dist))
});

function errorStyles(error) {
    notify.onError({title: "Sass Error", message: "", sound: "Sosumi"})(error);
    console.log(error.toString());
    this.emit("end");
}


// --------------------------------------------------------------
// Scripts
// ---------------------------------------------------------------

gulp.task('scripts', function() {
    return gulp.src(paths.scripts.src + '**/*')
          .pipe(jshint())
          .pipe(notify(function(file) {
            if (file.jshint.success)
            return false;
            var errors = file.jshint.results.map(function(data) {
              if (data.error)
                return "(" + data.error.line + ':' + data.error.character + ') ' + data.error.reason;
              }).join("\n");
            return {
              title: 'JavaScript error',
              message: file.relative + " (" + file.jshint.results.length + " errors)\n" + errors,
              sound: 'Frog',
            };
          }))
        .pipe(concat('script.js'))
        .pipe(uglify().on('error', function(e){
          console.log(e);
        }))
        .pipe(gulp.dest(paths.scripts.dist))
});


// --------------------------------------------------------------
// Vendor
// ---------------------------------------------------------------

gulp.task('vendor', function() {
    return gulp.src(paths.vendor.src + '**/*')
        .pipe(concat('vendor.js'))
        .pipe(uglify())
        .pipe(gulp.dest(paths.vendor.dist))
});


// --------------------------------------------------------------
// Watch
// ---------------------------------------------------------------

gulp.task('watch', function() {
    gulp.watch(paths.styles.src  + '*.scss', gulp.parallel('styles'));
    gulp.watch(paths.scripts.src + '/*.js',  gulp.parallel('scripts'));
    gulp.watch(paths.vendor.src  + '/*.js',  gulp.parallel('vendor'));
});

gulp.task('default', gulp.parallel('styles', 'scripts', 'vendor', 'watch'));

Answer 1

paths.scripts.src + '/*.js' 和 paths.vendor.src + '/*.js' 包含额外的 /

感谢 Thomas Sablik

Gulp看不看.js文件

Gulp watch not watching .js files

javascript

gulp

gulp-watch