Add react-scan in local development mode

kamilkisiela · n1ru4l · commit 522cacb54eb4 · 2025-05-28T15:21:32.000+02:00
diff --git a/packages/web/app/vite.config.ts b/packages/web/app/vite.config.ts
@@ -1,13 +1,28 @@
 import { resolve } from 'node:path';
-import type { UserConfig } from 'vite';
+import type { Plugin, UserConfig } from 'vite';
 import tsconfigPaths from 'vite-tsconfig-paths';
 import react from '@vitejs/plugin-react';
 
 const __dirname = new URL('.', import.meta.url).pathname;
 
+// Add react-scan in local development mode
+const reactScanPlugin: Plugin = {
+  name: 'react-scan',
+  transformIndexHtml(html, ctx) {
+    if (ctx.server?.config.command === 'serve') {
+      return html.replace(
+        '<head>',
+        '<head><script src="https://unpkg.com/react-scan/dist/auto.global.js"></script>',
+      );
+    }
+
+    return html;
+  },
+};
+
 export default {
   root: __dirname,
-  plugins: [tsconfigPaths(), react()],
+  plugins: [tsconfigPaths(), react(), reactScanPlugin],
   build: {
     rollupOptions: {
       input: {
