Output filename for gulp/webpack task

Question

I'm using webpack-stream to integrate webpack into a gulp task, as below:

var gulp = require("gulp");
// var webpack = require('gulp-webpack');
var webpack = require('webpack-stream');

gulp.task("min:webpack",
    function () {
        return gulp.src('./App/App.js')
         .pipe(webpack({
             // watch: true,
             module: {
                 entry: './App/App.js',
                 output: {
                     filename: 'App.bundle.js'
                 },
                 devtool: 'source-map'
             }
         }))
        .pipe(gulp.dest('./App'));
    });

Everything seems to be working as expected, except that the output file is always something like 6f7af85206d7f2f6536d.js instead of the expected App.bundle.js. In other similar questions (e.g., How to use gulp webpack-stream to generate a proper named file?), I've read that it was fixed effectively by specifying output: { filename: 'something'} in the configuration, but you can see that I'm doing that.

Any suggestions? Anything I'm overlooking?

score 2 · Accepted Answer · answered Apr 13 '16 at 18:22

OK, dumb mistake on my part. I had the configuration specified incorrectly. This config works as expected:

gulp.task("min:webpack",
    function () {
        return gulp.src('./App/App.js')
         .pipe(webpack({
             // watch: true,
             entry: './App/App.js',
             output: {
                 filename: 'App.bundle.js'
             },
             devtool: 'source-map'
         }))
        .pipe(gulp.dest('./App'));
    });

Output filename for gulp/webpack task

1 Answers1