Does Webpack provide a global error hook when a chunk load fails?

Question

After a migration from RequireJS to Webpack 4, I was looking for an equivalent to require.onError to capture runtime chunk load errors, but I couldn't find any options to add a global error handler.

I know that's possible to capture errors when using async import calls, like this one:

import('module/path')
.catch(function() {
    // error handling code
});

But, is there a Webpack option to add a generic chunk load error catch? so I can to provide further troubleshooting options to users (like a refresh the page prompt).

My app does heavy usage of async/lazy load and adding the error management code inline in every import call is not an option, since I need a fallback to make sure that there will be an error handler in case a dev forgets to add error management.

Answer 1

Encountered same problem and explored webpack 4, but couldn't find anything similar to require.onError in webpack for dynamic imports. I have written a babel plugin that will attach catch to every dynamic import and will take error handler function definition in babel plugin options.

As dynamic imports are promises so chaining promises and attaching catch will attach custom error handler, without causing existing code to break.

Here is the babel plugin, https://www.npmjs.com/package/babel-plugin-dynamic-import-override

P.S. I didn't want to use window.onerror and wanted specific error handler.