Retry import / chunk / CSS loads for transient network errors

[edwh]

Description

As a developer I want my code to be resilient to transient network errors.

Two extremely common Sentry errors on my live Nuxt site are TypeError: Importing a module script failed and Unable to preload CSS. These are almost certainly caused by transient network errors on mobile devices.

(The fact that I get the Sentry reports at all shows there are a lot of transient errors. I also have sleep/retry function in my API-accessing code for this reason using fetch-retry and which I can tell succeeds after some retries. So transient network errors are a common thing.)

I'd like to be able to add retrying for loading JS and CSS too. So far as I know, there is no current way to do this, which means that mobile users commonly experience the site simply stopping working.

Suggested solution

I don't know enough about how vite loads code to suggest specifics. @danielroe may be able to.

Alternative

I am aware of discussions about detecting chunk load errors in the case where a new version of the code has been deployed. This is not that case, though it is related.

I'm also aware of the preload function. That reduces the chances of this happening, but a) doesn't cure it and b) costs more network data for mobile users and therefore may not be desirable.

Additional context

I'm interested in everything that gets loaded - whether it's an entry script, a chunk, a dynamic component, CSS, or anything else that I might not have thought of. The network doesn't discriminate about what it will fail, and the best user behaviour is for things to start working again when the network does.

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

[xiemms]

mark

[sapphi-red]

This is already implemented in both Vite and Nuxt (#12084). (There was a bug though #15203)
For Nuxt, see https://nuxt.com/docs/guide/going-further/experimental-features#emitroutechunkerror.

[xiemms]

您好，我最近比较忙，无法亲自回复您的邮件。我如果我看到您的邮件，我会尽快给您回复。