build: bundle as single HTML file via vite-plugin-singlefile

Gitea Pages serves .js with text/plain MIME, which browsers reject for ES
modules. Inlining the entire bundle into index.html bypasses the issue and
keeps the deploy a single static file.

package-lock.json

@@ -22,7 +22,8 @@
         "postcss": "^8.4.41",
         "tailwindcss": "^3.4.10",
         "typescript": "^5.5.4",
-        "vite": "^5.4.2"
+        "vite": "^5.4.2",
+        "vite-plugin-singlefile": "^2.3.3"
       }
     },
     "node_modules/@alloc/quick-lru": {
@@ -2934,6 +2935,28 @@
         }
       }
     },
+    "node_modules/vite-plugin-singlefile": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/vite-plugin-singlefile/-/vite-plugin-singlefile-2.3.3.tgz",
+      "integrity": "sha512-XVnGH0QzbOa8fxRSsHdCarVN1BSBXNi7uLMQYlrGRN5apdHkk62XQWRJhVever0lnfuyBkwn+kvVChdm/OoOUg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "micromatch": "^4.0.8"
+      },
+      "engines": {
+        "node": ">18.0.0"
+      },
+      "peerDependencies": {
+        "rollup": "^4.59.0",
+        "vite": "^5.4.21 || ^6.0.0 || ^7.0.0 || ^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "rollup": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/yallist": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",

package.json

@@ -23,6 +23,7 @@
     "postcss": "^8.4.41",
     "tailwindcss": "^3.4.10",
     "typescript": "^5.5.4",
-    "vite": "^5.4.2"
+    "vite": "^5.4.2",
+    "vite-plugin-singlefile": "^2.3.3"
   }
 }

vite.config.ts

@@ -1,11 +1,19 @@
 import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
+import { viteSingleFile } from 'vite-plugin-singlefile';
 
 export default defineConfig({
-  plugins: [react()],
+  plugins: [react(), viteSingleFile()],
   base: './',
   build: {
     outDir: 'dist',
     assetsDir: 'assets',
+    cssCodeSplit: false,
+    assetsInlineLimit: 100_000_000,
+    rollupOptions: {
+      output: {
+        inlineDynamicImports: true,
+      },
+    },
   },
 });