We are using webpack2 and the split-by-path-webpack-plugin. We had to patch the plugin in order to use it with webpack2, but after building the bundle, it seems that there is still something wrong.
This is our configuration:
module.exports = {
context: APP,
target: 'web',
entry: {
bundle: './.caches/jsClient/Admin/App.js',
},
output: {
path: path.join(__dirname, 'dist'),
filename: "[name]_[chunkhash].js",
chunkFilename: "[name]_[chunkhash].js",
publicPath: '../dist/',
},
devtool: 'source-map',
resolve: {
extensions: ['.webpack.js', '.web.js', '.ts', '.js'],
},
performance: {
hints: false,
},
module: {
rules: [
// { test: /(?!\.min)\.js$/, enforce: 'pre', loader: "source-map-loader" }
{ test: /\.css$/, loader: "style-loader!css-loader" },
{
test: /\.html$/, // Only .html files
loader: 'html-loader' // Run html loader
},
{ test: /.(png|woff(2)?|eot|ttf|svg)(\?[a-z0-9=\.]+)?$/, loader: 'file-loader?name=[name].[ext]' },
]
},
plugins: [
new Md5Hash(),
new AssetsPlugin({update: true}),
new ChunkManifestPlugin({
filename: "chunk-manifest.json",
manifestVariable: "webpackManifest"
}),
new SplitByPathPlugin({
buckets: [{
name: 'vendor',
regex: /node_modules/,
}]
}),
new WebpackCleanupPlugin({
quiet: true,
exclude: ["chunk-manifest.json", "Fonts/**/*"]
})
]
};
Both bundle and vendor files are created and we load the bundle file first, but they don’t get executed as intended.
TypeError: modules[moduleId] is undefined (bundle.js)
ReferenceError: webpackJsonp is not defined (vendor.js)
When I look at our resulting bundle, I’m unable to find any definition of the jsonp function. Does the split-by-path plugin need to do anything so the method gets defined?
This current behavior is quite confusing from a users standpoint.
okay, I figured it out!