javascript - gulp-concat twice the content -
that's weird thing me, have task concat .js
files , uglify them watcher, concat
task twice content in every call...
here 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 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}`)); }); /* bootstrap-styl js files , 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}`)); }); /* js assets 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 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']);
the bootstrap-build
task don't twice content no matter how many times call task, js-build
does.
here test separated scripts concat , results:
file 1:
(function() { console.log("oh!") console.log("uh!") }).call(this);
file 2:
(function() { console.log("hey") }).call(this);
concated file(uh, oh file re-saved after watcher fired):
(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
in every re-save, concat twice content... don't problem. idea?
thanks in adnvance.
the reason bootstrap-build
works because places resulting bootstrap.min.js
in different folder source files.
your js-build
task concatenates .js
files in path.js
folder , places resulting site.min.js
in same folder.
that means when first running js-build
files file1.js
, file2.js
concatenated site.min.js
. on second run files file1.js
, file2.js
, site.min.js
concatenated site.min.js
. every time run js-build
task site.min.js
grows.
what need exclude site.min.js
being concatenated other files:
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}`)); })
Comments
Post a Comment