Search code examples
javascriptwebpackgulpreferenceerrorgulp-webpack

webpack is not defined - gulp - but IS defined


I'm using Gulp and webpack, I imported both webpack and webpack-stream in my gulpfile.js but for some reason the console says webpack is not defined

my gulp import are correct :

var webpack = require('webpack');
var webpackStream = require('webpack-stream');

My task which should compile

gulp.task('webpack', function() {
    return gulp.src(paths.srcClient)
        .pipe(webpackStream(require('./webpack.config.js'), webpack))
        .pipe(gulp.dest(paths.buildJs));

My webpack config if needed

module.exports = {
    entry: './src/client.js',

    output: {
        path: __dirname + '/build/assets/js',
        filename: '[name].js'
    },

    module: {
        loaders: [
            {
                test: /\.js$/,
                loader: 'babel-loader',
                exclude: '/node_modules/',
                query: {
                    cacheDirectory: true,
                    presets: ['es2015']
                }
            }
        ]
    },

    plugins: [
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: false
            }
        })
    ]
};

The error from the output :

Starting 'webpack'...
[16:29:38] 'webpack' errored after 2.24 ms
[16:29:38] ReferenceError: webpack is not defined
    at Object.<anonymous> (/home/k3nzie/projects/jsGame/webpack.config.js:25:13)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Gulp.<anonymous> (/home/k3nzie/projects/jsGame/gulpfile.js:28:29)
    at module.exports (/home/k3nzie/projects/jsGame/node_modules/orchestrator/lib/runTask.js:34:7)

Any suggestions? I'm gettin insane lately with webpack...


Solution

  • webpack is not defined in it config file.

    In top of webpack.config.js, implement :

    var UglifyJsPlugin = require('uglifyjs-webpack-plugin')
    

    And in plugins line on webpack.config.js :

    plugins: [
        new UglifyJsPlugin({
            compress: {
                warnings: false
            }
        })
    ]