fix(vite): add data-cfasync="false" to script tags to prevent Cloudflare Rocket Loader breaking JS

Cloudflare Rocket Loader rewrites <script type="module"> to
<script type="randomhash-module"> which browsers can't parse,
causing complete blank page. data-cfasync="false" disables this.

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
MythEclipse
2026-06-15 23:00:30 +07:00
co-authored by Claude
parent 250355562f
commit 787acf077f
+16 -1
View File
@@ -9,7 +9,22 @@ export default defineConfig(({ mode }) => {
const apiProxyTarget = env.VITE_API_PROXY_TARGET || 'http://localhost:3000'; const apiProxyTarget = env.VITE_API_PROXY_TARGET || 'http://localhost:3000';
return { return {
plugins: [react(), tsconfigPaths(), metricsPlugin()], plugins: [
react(),
tsconfigPaths(),
metricsPlugin(),
{
name: 'cloudflare-rocket-loader-fix',
transformIndexHtml(html) {
// Prevent Cloudflare Rocket Loader from mangling <script type="module">
// which breaks the entire JS bundle (blank page)
return html.replace(
/<script type="module"/g,
'<script data-cfasync="false" type="module"',
);
},
},
],
server: { server: {
proxy: { proxy: {
'/api': apiProxyTarget, '/api': apiProxyTarget,