fix(infra): bypass Cloudflare Rocket Loader — breaks ES module scripts
Cloudflare Rocket Loader transforms <script type="module"> into type="<hash>-module", which the browser cannot parse as ES module. The React app never mounts — blank page on every route. Fix: Vite plugin adds data-cfasync="false" attribute to the module script tag, telling Rocket Loader to skip transformation. Also: remove dist/ from the commit (build artifacts excluded).
This commit is contained in:
@@ -1,8 +1,22 @@
|
|||||||
import react from "@vitejs/plugin-react";
|
import react from "@vitejs/plugin-react";
|
||||||
import { defineConfig } from "vite";
|
import { defineConfig, type Plugin } from "vite";
|
||||||
|
|
||||||
|
/** Cloudflare Rocket Loader breaks ES module scripts by rewriting type="module".
|
||||||
|
* Adding data-cfasync="false" tells Rocket Loader to skip this script. */
|
||||||
|
function cloudflareCompat(): Plugin {
|
||||||
|
return {
|
||||||
|
name: "cloudflare-compat",
|
||||||
|
transformIndexHtml(html) {
|
||||||
|
return html.replace(
|
||||||
|
'<script type="module" crossorigin',
|
||||||
|
'<script type="module" data-cfasync="false" crossorigin',
|
||||||
|
);
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [react()],
|
plugins: [react(), cloudflareCompat()],
|
||||||
build: {
|
build: {
|
||||||
rolldownOptions: {
|
rolldownOptions: {
|
||||||
checks: {
|
checks: {
|
||||||
|
|||||||
Reference in New Issue
Block a user