hard-source-webpack-plugin
hard-source-webpack-plugin copied to clipboard
Fonts are not being included in second and consecutive builds
Expected Behavior
Fonts are included in second and consecutive builds, just like the first run.
Actual Behavior
Fonts are not being included in second and consecutive builds.
Is an error being thrown?
No.
Steps to Reproduce
- Run the app for the first time, it builds fine and fonts are included as expected.
- Stop the app and run it second time, no errors with build but fonts are not included and broken on UI.
Using file-loader
for ttf
and woff
fonts.
Using postcss-loader
, css-loader
and extract-css-chunks-webpack-plugin/loader
for scss
files.
Using hard-source-webpack-plugin
as following:
new HardSourceWebpackPlugin(),
new HardSourceWebpackPlugin.ExcludeModulePlugin([
{
test: /extract-css-chunks-webpack-plugin[\\/]dist[\\/]loader/,
},
]),
Operating System, Node, and NPM dependency versions
Mac OS 10.13.6
Node 8.10.0
"devDependencies": {
"@babel/cli": "^7.4.3",
"@babel/core": "^7.4.3",
"@babel/node": "^7.2.2",
"@babel/polyfill": "^7.4.3",
"@babel/preset-env": "^7.4.3",
"@babel/preset-react": "^7.0.0",
"@babel/preset-typescript": "^7.7.2",
"@babel/runtime": "^7.4.3",
"babel-loader": "^8.0.0",
"css-loader": "^1.0.1",
"extract-css-chunks-webpack-plugin": "^4.3.0",
"file-loader": "^3.0.1",
"hard-source-webpack-plugin": "^0.13.1",
"html-webpack-plugin": "^3.2.0",
"postcss-loader": "^2.1.6",
"style-loader": "^0.19.0",
"typescript": "^3.6.4",
"webpack": "^4.27.1",
"webpack-cli": "^3.1.2",
"webpack-dev-middleware": "^2.0.6",
"webpack-hot-middleware": "^2.24.2",
"webpack-hot-server-middleware": "^0.3.2",
}
Similar Issues
https://github.com/mzgoddard/hard-source-webpack-plugin/issues/357 https://github.com/mzgoddard/hard-source-webpack-plugin/issues/378
Also an issue here - using
{
test: /\.(svg|png|woff2?|otf|eot|ttf)$/i,
use: {
loader: 'file-loader'
},
},
And all woff/otf files and some svgs don't show up on the page.
Hello,
I'm also having this issue, did you find a workaround ?
Thanks
I solved the problem like this:
new HardSourceWebpackPlugin(),
new HardSourceWebpackPlugin.ExcludeModulePlugin([
{
test: /file-loader/,
},
{
test: /webfonts-loader/,
},
]),
No caching fonts, no problem )
@attikos's workaround works well but surely this decreases the speed of the build (and certainly increases developer time since I had to come look for this bug)
I have a question, new HardSourceWebpackPlugin.ExcludeModulePlugin
can only be used for loader?
can i use :
new HardSourceWebpackPlugin.ExcludeModulePlugin([
{
test: /js-cookie/
}
]),
I have a question,
new HardSourceWebpackPlugin.ExcludeModulePlugin
can only be used for loader?can i use :
new HardSourceWebpackPlugin.ExcludeModulePlugin([ { test: /js-cookie/ } ]),
As the RegExp is applied to the whole request path of the module and module name is also a component of request path, I think the config you suggested above is available.
For details, debug here on yourself. ExcludeModulePlugin.js