Jul 28, 2017 · 1 min read
I’m having a couple issues with this configuration. I’m using webpack with an Angular project and I wanted to share my workarounds:
- The ‘runtime’ file you create to store the webpack manifest doesn’t get a new hash when its contents change.
My solution: I use the ‘inline-manifest-webpack-plugin’ (on npm) and add <%= htmlWebpackPlugin.files.webpackManifest %> to my index.html - Angular uses a special syntax in the routers to lazy-load modules. When this is done, it splits out chunks in the webpack output. These chunks don’t have names by default, and your use of the NamedChunksPlugin didn’t work for me. (Some modules wouldn’t have the 2 paths it compares to create a chunk name.)
My solution: I use the ‘ng-router-loader’ (on npm) which lets you add a chunkName property to the lazy loaded module strings. And when using the NamedChunksPlugin, I did not pass in a custom method to generate names. Route example:
{
path: “some/route”,
loadChildren: “app/some.module#TheModule?chunkName=TheModule”,
}