Search code examples
javascriptgulpbundlewebpack

Generating bundle.js with webpack & gulp


I have configured gulp & webpack to generate a bundle.js file, take a look the code below:

Gulp

// Webpack
gulp.task('webpack', function() {
  return gulp.src('./app/app.js')
    .pipe(webpack(require('./webpack.config.js')))
    .pipe(gulp.dest('./build'));
});

Webpack

var path = require('path');

module.export = {
    entry: './app/app.js',
    output: {
        filename: "./build/bundle.js",
        sourceMapFilename: "./build/bundle.map"
    },
    devtool: '#source-map',
    module: {
        loaders: [
            {
                loader: 'babel',
                test: /\.jsx?$/,
                exclude: /(node_modules|bower_components)/,
                query: {
                    presets: ['react', 'es2015', 'stage-2']
                }
            }
        ]
    },
    resolve: {
        root: path.resolve('./app'),
        extenstions: ['', '.js']
    }
}

Basically my problem is the file is generated correctly but the file name is wrong, should be bundle.js and I'm getting a random file name like 63432692d402c38f8df5.js

Any idea what is going on?

enter image description here


Solution

  • Change module.export to module.exports in your webpack.config.js