Question

我试图设置一些Gulp任务。我想连接一些JS文件，将它们缩小为创建1个JS文件，但我希望每次在原始JS文件中进行更改时都要完成，但我似乎无法获得＆＃39; watch＆＃ 39;任务正常运行

这是我的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']);
});

并将'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中的文件数组。

Gulp用手表任务结束并缩小

2 个答案: