吞並並通過監視任務最小化

Question

我正在嘗試設置一些Gulp任務。 我想串聯一些JS文件，將它們縮小以創建1個JS文件，但是我希望每次對原始JS文件進行更改后都執行此操作，但是我似乎無法正常運行“監視”任務

這是我的Gulpfile.js

gulp.task('minify', ['watch', 'scripts'], function(){
  gulp.src('themes/corp-fluid/js/dist/**/*.js')
          .pipe(minify({
            ext:{
              src:'-debug.js',
              min:'.js'
            },
            ignoreFiles: ['-min.js']
          }))
          .pipe(gulp.dest('themes/corp-fluid/js/dist'));
});

gulp.task('scripts', function(){
  return gulp.src(['themes/corp-fluid/js/slick.js', 'themes/corp-fluid/js/functions.js'])
          .pipe(concat('main.js'))
          .pipe(gulp.dest('themes/corp-fluid/js/dist'));
});

gulp.task('watch', function(){
  gulp.watch('themes/corp-fluid/js/**/*.js');
});

Answer 1

有幾件事。 您需要在“監視”任務中調用某些內容，因此

gulp.task('watch', function(){
  gulp.watch('themes/corp-fluid/js/**/*.js', ['minify']);
});

並將“縮小”任務的第一行簡化為

gulp.task('minify', ['scripts'], function(){

您無需在此處再次調用“監視”任務。 最后，您將使用

gulp watch

Answer 2

具有sass，js concat，minify和watch任務的Gulpfile。 您需要在瀏覽器同步任務中將代理域名更改為您的域名，並在concat_js任務中更改文件數組。

 var gulp = require('gulp') var browserSync = require('browser-sync') var sass = require('gulp-sass') var concat = require('gulp-concat'); var minify = require('gulp-minify'); //Sass gulp.task('sass', function () { return gulp.src('app/sass/**/*.scss') .pipe(sass()) // pipe(gulp.dest('app/css')) .pipe(gulp.dest('app/css/')) }); //browser reload gulp.task('browser-sync', function () { browserSync({ notify: false, proxy: "http://front-end" //Your domain name }); }); //concat gulp.task('concat_js', function() { //An array of files is required for the correct order of contact return gulp.src(['app/js/_helpers.js', 'app/js/_cookie_notice.js']) //file array need for .pipe(concat('all.js')) .pipe(minify({ ext:{ src:'', min:'.min.js' }, noSource: true})) .pipe(gulp.dest('app/js/')); }); //watch gulp.task('watch', ['browser-sync', 'sass'], function () { gulp.watch('app/sass/**/*.scss', ['sass']); gulp.watch('app/js/*.js', ['concat_js']); gulp.watch('app/**/*.*', browserSync.reload); }); gulp.task('default', ['watch', 'sass', 'concat_js']); 

注意：任務concat_js中的文件數組是正確的文件聯系順序所必需的。