將級聯文件放入main.js只是保持堆疊而不是清除文件，然後添加代碼

Question

我試圖將所有腳本編譯成單個main.js文件，然後我可以鏈接到我的索引文件。問題是我所有的腳本文件被連接在一起，然後將添加到main.js文件中，所以如果我保存3次，我基本上會將所有腳本連接3個副本並放入main.js文件中。

我想每次保存並刪除main.js文件，然後運行連接，或者在添加內容之前清理文件。現在，如果我嘗試使用del模塊刪除文件，則會收到一個錯誤消息，指出我無法在不強制執行此操作的情況下將文件從工作目錄中刪除。如果可能的話，我想避免強制這樣做。

我覺得必須有這樣做的更優雅的方式..

這裏是我的腳本任務：

// Concat and compile our JS into a minified dist file 
gulp.task('scripts', function() { 
    return gulp.src('../app/public/assets/scripts/**/*.js') 
    .pipe(jshint()) 
    .pipe(jshint.reporter('default')) 
    .pipe(concat('main.js')) 
    //.pipe(del(['../app/public/assets/scripts/main.js'])) <-- Doesn't work without forcing 
    .pipe(gulp.dest('../app/public/assets/scripts')) 
    .pipe(gulpif(flags.build, gulp.dest('../app/dist/assets/scripts'))) 
    .pipe(rename({ suffix: '.min' })) 
    .pipe(uglify()) 
    .pipe(gulpif(flags.build, gulp.dest('../app/dist/assets/scripts'))) 
    .pipe(notify({ message: 'Finished compiling scripts' })); 
}); 

Answer 1

我通常會做這樣的事情（很簡單:)）：

var PARAMS = { 
    destPath: 'build', 
    js: [ 
     'src/js/test1.js', 
     'src/js/test2.js', 
     // ecc... 
    ], 
    // other 
}; 

var TARGETS = { 
    dest: 'main.js', // dest file 

    extra: [ 
     // This files are inclued only in .bundle.min.js version 
     // extra file here 
    ], 

    js: [ 
     'src/js/test1.js', 
     'src/js/test2.js', 
     // ecc... 
    ] 
}; 

gulp.task('connect', function() { 
    return connect.server({ 
     livereload: true, 
     host: '0.0.0.0', 
     port: 8000 
    }); 
}); 

gulp.task('reload', ['build'], function() { 
    return gulp.src(['sandbox/**/*.html']) 
     .pipe(connect.reload()); 
}); 

gulp.task('watch', ['connect', 'build'], function() { 
    var src = []; 
    // other 
    src = src.concat(PARAMS.js); 
    return gulp.watch(src, ['reload']); 
}); 

gulp.task('clean', function (done) { 
    return del(['build'], done); 
}); 

gulp.task('build', ['clean'], function() { 
    return gulp.src(target.js); 
     .pipe(concat(target.dest)) 
     .pipe(gulp.dest(PARAMS.destPath)) // Plain 

     .pipe(uglify()) 
     .pipe(rename({ extname: '.min.js' })) // Minified 
     .pipe(gulp.dest(PARAMS.destPath)) 

     .pipe(addsrc(target.extra)) 
     .pipe(order(target.extra)) 
     .pipe(concat(target.dest)) 
     .pipe(rename({ extname: '.bundled.min.js' })) // Bundled 
     .pipe(gulp.dest(PARAMS.destPath)); 
}); 

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