一饮而尽-CONCAT两次内容

Question

这是一个奇怪的事情对我来说，我有一个任务，我的Concat的文件.js，然后用观察家丑化他们，但concat任务只是在两次每次通话内容......

这里是我的gulpfile：

'use strict'; 

let gulp  = require('gulp'); 
let stylus  = require('gulp-stylus'); 
let sourcemaps = require('gulp-sourcemaps'); 
let concat  = require('gulp-concat'); 
let uglify  = require('gulp-uglify'); 
let plumber  = require('gulp-plumber'); 
let bootstrap = require('bootstrap-styl'); 
let rupture  = require('rupture'); 
let copy  = require('gulp-copy2'); 

/* 
    Prepare the paths 
*/ 
let base = './theme'; 
let themeName = 'own-theme'; 

let paths = { 
    stylus : `${base}/${themeName}/css`, 
    js  : `${base}/${themeName}/js`, 
    vendor : `${base}/${themeName}/js/vendor` 
} 

/* 
    Stylus compile 
*/ 
gulp.task('stylus-compile',() => { 
    return gulp.src([`${paths.stylus}/dev/*.styl`, `${paths.stylus}/!**/_*.styl`]) 
    .pipe(plumber()) 
    .pipe(stylus({ 
     use: [bootstrap(), rupture()], 
     compress: true 
    })) 
    .pipe(sourcemaps.write('./')) 
    .pipe(gulp.dest(`${paths.stylus}`)); 
}); 

/* 
    Get the bootstrap-styl js files and concat/uglify them 
*/ 

gulp.task('bootstrap-build',() => { 
    return gulp.src([ 
    'node_modules/bootstrap-styl/js/transition.js', 
    'node_modules/bootstrap-styl/js/alert.js', 
    'node_modules/bootstrap-styl/js/button.js', 
    'node_modules/bootstrap-styl/js/carousel.js', 
    'node_modules/bootstrap-styl/js/collapse.js', 
    'node_modules/bootstrap-styl/js/dropdown.js', 
    'node_modules/bootstrap-styl/js/modal.js', 
    'node_modules/bootstrap-styl/js/tooltip.js', 
    'node_modules/bootstrap-styl/js/popover.js', 
    'node_modules/bootstrap-styl/js/scrollspy.js', 
    'node_modules/bootstrap-styl/js/tab.js', 
    'node_modules/bootstrap-styl/js/affix.js' 
    ]) 
    .pipe(sourcemaps.init()) 
    .pipe(concat('bootstrap.min.js')) 
    .pipe(uglify()) 
    .pipe(sourcemaps.write('./')) 
    .pipe(gulp.dest(`${paths.vendor}`)); 

}); 

/* 
    Get the js assets from NPM 
*/ 
gulp.task('js-copy',() => { 
    let dirs = [ 
    { src: 'node_modules/jquery/dist/jquery.min.js', dest: `${paths.vendor}/jquery.min.js` }, 
    { src: 'node_modules/sweet-scroll/sweet-scroll.min.js', dest: `${paths.vendor}/sweet-scroll.min.js` } 
    ] 
    return copy(dirs); 
}); 

/* 
    Concat/Uglify the JS files 
*/ 
gulp.task('js-build',() => { 
return gulp.src(`${paths.js}/*.js`) 
    .pipe(sourcemaps.init()) 
    .pipe(concat('site.min.js')) 
    // .pipe(uglify()) 
    .pipe(sourcemaps.write('./')) 
    .pipe(gulp.dest(`${paths.js}`)); 
}) 

/* 
    Watch 
*/ 
gulp.task('watch',() => { 
    gulp.watch(`${paths.js}/*.js`, ['js-build']); 
    gulp.watch(`${paths.stylus}/dev/*.styl`, ['stylus-compile']); 
}); 

gulp.task('default', ['bootstrap-build', 'js-copy', 'watch']); 

的bootstrap-build任务不两倍的内容，不管你有多少次调用任务，但js-build一样。

下面是测试分离脚本Concat的，结果：

文件1：

(function() { 

    console.log("oh!") 
    console.log("uh!") 

}).call(this); 

文件2：

(function() { 
    console.log("hey") 
}).call(this); 

Concated文件（呃，哦文件重新保存在观察员被解雇后）：

(function() { 

    console.log("oh!") 
    console.log("uh!") 

}).call(this); 
(function() { 

    console.log("oh!") 
    console.log("uh!") 

}).call(this); 
(function() { 
    console.log("hey") 
}).call(this); 
//# sourceMappingURL=site.min.js.map 

(function() { 
    console.log("hey") 
}).call(this); 
//# sourceMappingURL=site.min.js.map 

在每次重新保存时，连续两次的内容...我真的没有得到这个问题。任何想法？

非常感谢。

Answer 1

您的bootstrap-build工作原因是因为它将得到的bootstrap.min.js放在与源文件不同的文件夹中。

您的js-build任务会连接文件夹中的所有.js文件，并将产生的site.min.js放在同一文件夹中。

这意味着当第一次运行js-build时，文件file1.js和file2.js连接成site.min.js。第二次运行时，文件file1.js,file2.js和site.min.js连接成site.min.js。每次运行js-build任务时，您的site.min.js都会增长。

你需要做的是从与其他文件进行级联排除site.min.js：

gulp.task('js-build',() => { 
    return gulp.src([ 
     `${paths.js}/*.js`, 
     `!${paths.js}/site.min.js` 
    ]) 
    .pipe(sourcemaps.init()) 
    .pipe(concat('site.min.js')) 
    // .pipe(uglify()) 
    .pipe(sourcemaps.write('./')) 
    .pipe(gulp.dest(`${paths.js}`)); 
})