Skip to content

Commit b6576b4

Browse files
merge vite@42993bb
1 parent 1fecbb5 commit b6576b4

File tree

2 files changed

+45
-2
lines changed

2 files changed

+45
-2
lines changed

docs/guide/build.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ window.addEventListener('vite:preloadError', (event) => {
7878
})
7979
```
8080

81-
When a new deployment occurs, the hosting service may delete the assets from previous deployments. As a result, a user who visited your site before the new deployment might encounter an import error. This error happens because the assets running on that user's device are outdated and it tries to import the corresponding old chunk, which is deleted. This event is useful for addressing this situation.
81+
When a new deployment occurs, the hosting service may delete the assets from previous deployments. As a result, a user who visited your site before the new deployment might encounter an import error. This error happens because the assets running on that user's device are outdated and it tries to import the corresponding old chunk, which is deleted. This event is useful for addressing this situation. In this case, make sure to set `Cache-Control: no-cache` on the HTML file, otherwise the old assets will be still referenced.
8282

8383
## Rebuild on Files Changes
8484

docs/guide/troubleshooting.md

Lines changed: 44 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,45 @@ You will need to access the file with `http` protocol. The easiest way to achiev
150150

151151
If you encounter errors like `ENOENT: no such file or directory` or `Module not found`, this often occurs when your project was developed on a case-insensitive filesystem (Windows / macOS) but built on a case-sensitive one (Linux). Please make sure that the imports have the correct casing.
152152

153+
### `Failed to fetch dynamically imported module` error
154+
155+
> TypeError: Failed to fetch dynamically imported module
156+
157+
This error occurs in several cases:
158+
159+
- Version skew
160+
- Poor network conditions
161+
- Browser extensions blocking requests
162+
163+
#### Version skew
164+
165+
When you deploy a new version of your application, the HTML file and the JS files still reference old chunk names that were deleted in the new deployment. This happens when:
166+
167+
1. Users have an old version of your app cached in their browser
168+
2. You deploy a new version with different chunk names (due to code changes)
169+
3. The cached HTML tries to load chunks that no longer exist
170+
171+
If you are using a framework, refer to their documentation first as it may have a built-in solution for this problem.
172+
173+
To resolve this, you can:
174+
175+
- **Keep old chunks temporarily**: Consider keeping the previous deployment's chunks for a period to allow cached users to transition smoothly.
176+
- **Use a service worker**: Implement a service worker that will prefetch all the assets and cache them.
177+
- **Prefetch the dynamic chunks**: Note that this does not help if your HTML file is cached by the browser due to `Cache-Control` headers.
178+
- **Implement a graceful fallback**: Implement error handling for dynamic imports to reload the page when chunks are missing. See [Load Error Handling](./build.md#load-error-handling) for more details.
179+
180+
#### Poor network conditions
181+
182+
This error may occur in unstable network environments. For example, when the request fails due to network errors or server downtime.
183+
184+
Note that you cannot retry the dynamic import due to browser limitations ([whatwg/html#6768](https://github.com/whatwg/html/issues/6768)).
185+
186+
#### Browser extensions blocking requests
187+
188+
The error may also occur if the browser extensions (like ad-blockers) are blocking that request.
189+
190+
It might be possible to work around by selecting a different chunk name by [`build.rollupOptions.output.chunkFileNames`](../config/build-options.md#build-rollupoptions), as these extensions often block requests based on file names (e.g. names containing `ad`, `track`).
191+
153192
## Optimized Dependencies
154193

155194
### Outdated pre-bundled deps when linking to a local package
@@ -206,7 +245,11 @@ If these codes are used inside dependencies, you could use [`patch-package`](htt
206245

207246
### Browser extensions
208247

209-
Some browser extensions (like ad-blockers) may prevent the Vite client from sending requests to the Vite dev server. You may see a white screen without logged errors in this case. Try disabling extensions if you have this issue.
248+
Some browser extensions (like ad-blockers) may prevent the Vite client from sending requests to the Vite dev server. You may see a white screen without logged errors in this case. You may also see the following error:
249+
250+
> TypeError: Failed to fetch dynamically imported module
251+
252+
Try disabling extensions if you have this issue.
210253

211254
### Cross drive links on Windows
212255

0 commit comments

Comments
 (0)