Menu icon Foundation
Combine Javascript into one file

In gulpfile.babel.js the function javascript says

// Combine JavaScript into one file
// In production, the file is minified
function javascript() {
	return gulp.src(PATHS.entries)
		.pipe(named())
		.pipe($.sourcemaps.init())
		.pipe(webpackStream(webpackConfig, webpack2))
		.pipe($.if(PRODUCTION, $.uglify()
			.on('error', e => { console.log(e); })
		))
		.pipe($.if(!PRODUCTION, $.sourcemaps.write()))
		.pipe(gulp.dest(PATHS.dist + '/assets/js'));
}

There's a comment that says »Combine JavaScript into one file« but it doesn't. There's is a single .js file for every file I set to »entry« in config.yml.

Is there a way to really bundle all entry files into one single file?

webpackfoundation 6.4javascriptbundle

In gulpfile.babel.js the function javascript says

// Combine JavaScript into one file
// In production, the file is minified
function javascript() {
	return gulp.src(PATHS.entries)
		.pipe(named())
		.pipe($.sourcemaps.init())
		.pipe(webpackStream(webpackConfig, webpack2))
		.pipe($.if(PRODUCTION, $.uglify()
			.on('error', e => { console.log(e); })
		))
		.pipe($.if(!PRODUCTION, $.sourcemaps.write()))
		.pipe(gulp.dest(PATHS.dist + '/assets/js'));
}

There's a comment that says »Combine JavaScript into one file« but it doesn't. There's is a single .js file for every file I set to »entry« in config.yml.

Is there a way to really bundle all entry files into one single file?

Kevin Ball about 1 month ago

You'll get one output per entry - that's the point of the entry! It's conceptually similar to how your app.scss file would work; a central clearing point that imports the code you need and then runs it. However, all of the files that are imported by that entry will be output into a single file.

If this is still confusing check out the JavaScript section of this walkthrough of the ZURB stack: https://zendev.com/2017/09/05/front-end-development-kickstarter-zurb-template.html#javascript