AggressiveSplittingPlugin & # 8594; webpackJsonp not defined

Question

With the switch to webpack2 for the sake of using AggressiveSplittingPlugin and speeding up the download of the package via HTTP / 2, I ran into the problem "Uncaught ReferenceError: webpackJsonp not defined" when initializing each part. Has anyone encountered such a situation and have you somehow solved this problem?

var path = require('path'); var webpack = require('webpack'); var ManifestPlugin = require('webpack-manifest-plugin'); module.exports = { devtool: 'source-map', entry: [ path.join(__dirname, '../../js/main'), 'jquery' ], output: { path: path.join(__dirname, '../../js/public'), filename: '[name].js', publicPath: '/assets/' }, resolve: { alias: {'jquery': path.join(__dirname, '../../js/modules/libs/jquery-2.2.3.min.js')}, extensions: ['.js', '.jsx'], modules: [ path.resolve(path.join(__dirname, '../../js')), "node_modules" ], }, plugins: [ new webpack.optimize.OccurrenceOrderPlugin(true), new webpack.NoEmitOnErrorsPlugin(), new webpack.optimize.UglifyJsPlugin({ output: { comments: false }, compress: { warnings: false, // eslint-disable-next-line camelcase screw_ie8: true } }), new webpack.ProvidePlugin({ jQuery: 'jquery', $: 'jquery', jquery: 'jquery' }), new webpack.optimize.AggressiveSplittingPlugin({ minSize: 20000, maxSize: 50000 }), new ManifestPlugin({ fileName: 'manifest.json', basePath: 'js/public/' }), ], module: { rules: [ { test: /\.js$/, use: [ { loader: 'babel-loader' } ], include: path.join(__dirname, '../../js'), exclude: /node_modules/ } ] } }; 

Answer 1

You can use CommonsChunkPlugin to retrieve a manifest that will also contain the webpack runtime:

 new webpack.optimize.CommonsChunkPlugin({ name: 'manifest' }) 

You will also need to make sure that this manifest is the first script and script tag for the other (aggressively separated) fragments.