faceyspacey / faceyspacey/webpack-flush-chunks
[FLUSH CHUNKS]: Unable to find pages-Home in Webpack chunks. Please check usage of Babel plugin.
- Dominant language
- JavaScript
- Stars
- 354
- Forks
- 30
- PR merge metrics
- No merged PRs in 30d
Description
I'm receiving this error after updating to Webpack 4 and updated the Universal modules:
`[FLUSH CHUNKS]: Unable to find pages-Home in Webpack chunks. Please check usage of Babel plugin.`
My page no longer loads the page specific `.js` file. (Used to load ``)
This is what shows up in my HTML now:
```
```
The page successfully loads, but it is without javascript. What have I done wrong?
**client.dev.js**
```
const path = require('path')
const webpack = require('webpack')
const WriteFilePlugin = require('write-file-webpack-plugin')
const AutoDllPlugin = require('autodll-webpack-plugin')
module.exports = {
name: 'client',
mode: 'development',
target: 'web',
devtool: 'cheap-module-source-map',
entry: [
'@babel/polyfill',
'webpack-hot-middleware/client?path=/__webpack_hmr&timeout=20000&reload=false&quiet=false&noInfo=false',
path.resolve(__dirname, '../../src/index.js')
],
output: {
filename: '[name].js',
chunkFilename: '[name].js',
path: path.resolve(__dirname, '../../buildClient'),
publicPath: '/static/'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
},
{
test: /\.(ttf|woff|woff2)$/,
exclude: /node_modules/,
use: {
loader: 'file-loader',
options: {
outputPath: 'assets/'
}
}
},
{
test: /\.(png|jpg|gif)$/,
exclude: /node_modules/,
use: {
loader: 'file-loader',
options: {
outputPath: 'assets/'
}
}
}
]
},
resolve: {
extensions: ['.js', '.ttf', '.woff', '.woff2']
},
optimization: {
runtimeChunk: {
name: 'bootstrap'
},
splitChunks: {
chunks: 'initial',
cacheGroups: {
vendors: {
test: /[\\/]node_modules[\\/]/,
name: 'vendor',
priority: -10
}
}
}
},
plugins: [
new WriteFilePlugin(), // See what chunks are produced in `dev`
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify('development')
}
}),
new AutoDllPlugin({
context: path.join(__dirname, '../..'),
filename: '[name].js',
entry: {
vendor: [
'react',
'react-dom',
'react-redux',
'redux',
'history/createBrowserHistory',
'redux-first-router',
'redux-first-router-link',
'@babel/polyfill',
'redux-devtools-extension/logOnlyInProduction'
]
}
})
]
}
```
**server.dev.js**
```
const fs = require('fs')
const path = require('path')
const webpack = require('webpack')
const WriteFilePlugin = require('write-file-webpack-plugin')
const res = p => path.resolve(__dirname, p)
// If you're specifying externals to leave unbundled, you need to tell Webpack
// to still bundle `react-universal-component`, `webpack-flush-chunks` and
// `require-universal-module` so that they know they are running within Webpack
// and can properly make connections to client modules:
const externals = fs
.readdirSync(res('../../node_modules'))
.filter(
x =>
!/\.bin|react-universal-component|require-universal-module|webpack-flush-chunks/.test(
x
)
)
.reduce((externals, mod) => {
externals[mod] = `commonjs ${mod}`
return externals
}, {})
module.exports = {
name: 'server',
mode: 'development',
target: 'node',
devtool: 'cheap-module-source-map',
entry: [
'@babel/polyfill',
res('../../server/render.js')
],
externals,
output: {
path: res('../../buildServer'),
filename: '[name].js',
libraryTarget: 'commonjs2',
publicPath: '/static/'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
},
{
test: /\.(ttf|woff|woff2)$/,
exclude: /node_modules/,
use: {
loader: 'file-loader',
options: {
outputPath: 'assets/'
}
}
},
{
test: /\.(png|jpg|gif)$/,
exclude: /node_modules/,
use: {
loader: 'file-loader',
options: {
outputPath: 'assets/'
}
}
}
]
},
resolve: {
extensions: ['.js', '.ttf', '.woff', '.woff2']
},
plugins: [
new WriteFilePlugin(),
new webpack.optimize.LimitChunkCountPlugin({
maxChunks: 1
}),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify('development')
}
})
]
}
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.