Webpack build error

Question

Having some issues with webpack. It builds fine but when I open my site, i get: Getting error: "Uncaught ReferenceError: webpackJsonp is not defined"

I believe my CommonsChunkPlugin is running before my app is bundled?

It may help to know I have my config in src/config/webpack.config.js which is building to dist/js/.

Have read https://medium.com/@MarkEwersDev/note-to-self-if-you-ever-get-this-uncaught-referenceerror-webpackjsonp-is-not-defined-message-and-d354f5c4d335#.9cysuil5p and https://github.com/webpack/webpack/issues/368 but neither seem to help unless I am missing something.

  devtool: 'source-map',
  entry: {
    vendor: [
      'react', 'react-dom', 'react-router', 'react-helmet', 'react-redux', 'moment-timezone', 'cookies-js', 'superagent', 'classnames', 'es6-promise'
    ],
    app: [
      './src/client/entry',
      './scss/main.scss',

    ]
  }
  output:{
    path: __dirname + '../../dist/js',
    filename: 'app.js'
  }
  plugins:[
    new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js'),

    new ExtractTextPlugin('../css/app.css', {
        allChunks: true
    }),
    new webpack.DefinePlugin({
      'process.env':{
        'NODE_ENV': JSON.stringify('production')
      }
    }),
    new webpack.optimize.AggressiveMergingPlugin(),
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.UglifyJsPlugin({
      compress: {
        warnings: true
      },
      output: {
        comments: false
      }
    }),
    ...persistentPlugins
  ],

Answer 1

The webpackJsonp function is defined by the commons chunk, so you must always put the commons chunk (vendor.js in your case) first when writing <script> tags. You also can't use <script async>.

Another possibility is that your vendor chunk is being overwritten by the entry chunk as you set output.filename to a constant string. Try naming it [name].js instead of app.js.