Fix react-refresh source maps (#12686)

Co-authored-by: Mark Dalgleish <[email protected]>

Author: soxtoby

.changeset/polite-clocks-shake.md

@@ -0,0 +1,5 @@
+---
+"@react-router/dev": patch
+---
+
+Fix react-refresh source maps

contributors.yml

@@ -276,6 +276,7 @@
 - soartec-lab
 - sorrycc
 - souzasmatheus
+- soxtoby
 - srmagura
 - SsongQ-92
 - stasundr

packages/react-router-dev/vite/plugin.ts

@@ -1701,32 +1701,14 @@ function addRefreshWrapper(
       ]
     : [];
   return (
-    "\n\n" +
-    withCommentBoundaries(
-      "REACT REFRESH HEADER",
-      REACT_REFRESH_HEADER.replaceAll("__SOURCE__", JSON.stringify(id))
-    ) +
-    "\n\n" +
-    withCommentBoundaries("REACT REFRESH BODY", code) +
-    "\n\n" +
-    withCommentBoundaries(
-      "REACT REFRESH FOOTER",
-      REACT_REFRESH_FOOTER.replaceAll("__SOURCE__", JSON.stringify(id))
-        .replaceAll("__ACCEPT_EXPORTS__", JSON.stringify(acceptExports))
-        .replaceAll("__ROUTE_ID__", JSON.stringify(route?.id))
-    ) +
-    "\n"
+    REACT_REFRESH_HEADER.replaceAll("__SOURCE__", JSON.stringify(id)) +
+    code +
+    REACT_REFRESH_FOOTER.replaceAll("__SOURCE__", JSON.stringify(id))
+      .replaceAll("__ACCEPT_EXPORTS__", JSON.stringify(acceptExports))
+      .replaceAll("__ROUTE_ID__", JSON.stringify(route?.id))
   );
 }
 
-function withCommentBoundaries(label: string, text: string) {
-  let begin = `// [BEGIN] ${label} `;
-  begin += "-".repeat(80 - begin.length);
-  let end = `// [END] ${label} `;
-  end += "-".repeat(80 - end.length);
-  return `${begin}\n${text}\n${end}`;
-}
-
 const REACT_REFRESH_HEADER = `
 import RefreshRuntime from "${virtualHmrRuntime.id}";
 
@@ -1747,7 +1729,7 @@ if (import.meta.hot && !inWebWorker) {
     RefreshRuntime.register(type, __SOURCE__ + " " + id)
   };
   window.$RefreshSig$ = RefreshRuntime.createSignatureFunctionForTransform;
-}`.trim();
+}`.replaceAll("\n", ""); // Header is all on one line so source maps aren't affected
 
 const REACT_REFRESH_FOOTER = `
 if (import.meta.hot && !inWebWorker) {
@@ -1762,7 +1744,7 @@ if (import.meta.hot && !inWebWorker) {
       if (invalidateMessage) import.meta.hot.invalidate(invalidateMessage);
     });
   });
-}`.trim();
+}`;
 
 function getRoute(
   pluginConfig: ResolvedReactRouterConfig,