Fix remix-routes not transforming source maps

remix-run · Mar 4, 2024 · cd919f3 · cd919f3
1 parent 1455009
commit cd919f3
Show file tree

Hide file tree

Showing 3 changed files with 69 additions and 56 deletions.
diff --git a/packages/remix-dev/vite/plugin.ts b/packages/remix-dev/vite/plugin.ts
@@ -1602,9 +1602,19 @@ export const remixVitePlugin: RemixVitePlugin = (remixUserConfig = {}) => {
           }
         }
 
+        let [filepath] = id.split("?");
+
+        let removedExports = removeExports(
+          code,
+          SERVER_ONLY_ROUTE_EXPORTS
+        )({
+          filename: id,
+          sourceFileName: filepath,
+        });
+
         return {
-          code: removeExports(code, SERVER_ONLY_ROUTE_EXPORTS),
-          map: null,
+          code: removedExports.code,
+          map: removedExports.map,
         };
       },
     },

diff --git a/packages/remix-dev/vite/remove-exports-test.ts b/packages/remix-dev/vite/remove-exports-test.ts
@@ -11,12 +11,12 @@ describe("removeExports", () => {
       export const clientExport_2 = () => {}
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "export const clientExport_1 = () => {};
     export const clientExport_2 = () => {};"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("arrow function with dependencies", () => {
@@ -39,16 +39,16 @@ describe("removeExports", () => {
       export const clientExport_2 = () => clientUtil()
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "import { clientLib } from 'client-lib';
     import { sharedLib } from 'shared-lib';
     const sharedUtil = () => sharedLib();
     const clientUtil = () => sharedUtil(clientLib());
     export const clientExport_1 = () => clientUtil();
     export const clientExport_2 = () => clientUtil();"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("function statement", () => {
@@ -61,12 +61,12 @@ describe("removeExports", () => {
       export function clientExport_2(){}
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "export function clientExport_1() {}
     export function clientExport_2() {}"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("function statement with dependencies", () => {
@@ -89,8 +89,8 @@ describe("removeExports", () => {
       export function clientExport_2() { return clientUtil() }
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "import { clientLib } from 'client-lib';
     import { sharedLib } from 'shared-lib';
     function sharedUtil() {
@@ -106,7 +106,7 @@ describe("removeExports", () => {
       return clientUtil();
     }"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("object", () => {
@@ -119,12 +119,12 @@ describe("removeExports", () => {
       export const clientExport_2 = {}
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "export const clientExport_1 = {};
     export const clientExport_2 = {};"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("object with dependencies", () => {
@@ -147,8 +147,8 @@ describe("removeExports", () => {
       export const clientExport_2 = { value: clientUtil() }
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "import { clientLib } from 'client-lib';
     import { sharedLib } from 'shared-lib';
     const sharedUtil = () => sharedLib();
@@ -160,7 +160,7 @@ describe("removeExports", () => {
       value: clientUtil()
     };"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("function call", () => {
@@ -173,12 +173,12 @@ describe("removeExports", () => {
       export const clientExport_2 = globalFunction()
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "export const clientExport_1 = globalFunction();
     export const clientExport_2 = globalFunction();"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("function call with dependencies", () => {
@@ -201,16 +201,16 @@ describe("removeExports", () => {
       export const clientExport_2 = clientUtil()
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "import { clientLib } from 'client-lib';
     import { sharedLib } from 'shared-lib';
     const sharedUtil = () => sharedLib();
     const clientUtil = () => sharedUtil(clientLib());
     export const clientExport_1 = clientUtil();
     export const clientExport_2 = clientUtil();"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("iife", () => {
@@ -223,12 +223,12 @@ describe("removeExports", () => {
       export const clientExport_2 = (() => {})()
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "export const clientExport_1 = (() => {})();
     export const clientExport_2 = (() => {})();"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("iife with dependencies", () => {
@@ -251,16 +251,16 @@ describe("removeExports", () => {
       export const clientExport_2 = (() => clientUtil())()
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "import { clientLib } from 'client-lib';
     import { sharedLib } from 'shared-lib';
     const sharedUtil = () => sharedLib();
     const clientUtil = () => sharedUtil(clientLib());
     export const clientExport_1 = (() => clientUtil())();
     export const clientExport_2 = (() => clientUtil())();"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("re-export", () => {
@@ -273,12 +273,12 @@ describe("removeExports", () => {
       export { clientExport_2 } from './client/2'
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "export { clientExport_1 } from './client/1';
     export { clientExport_2 } from './client/2';"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("re-export multiple", () => {
@@ -289,11 +289,11 @@ describe("removeExports", () => {
       export { clientExport_1, clientExport_2 } from './client'
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(
+    )({});
+    expect(result.code).toMatchInlineSnapshot(
       "\"export { clientExport_1, clientExport_2 } from './client';\""
     );
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("re-export manual", () => {
@@ -311,14 +311,14 @@ describe("removeExports", () => {
       export { clientExport_2 }
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "import { clientExport_1 } from './client/1';
     import { clientExport_2 } from './client/2';
     export { clientExport_1 };
     export { clientExport_2 };"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("number", () => {
@@ -331,12 +331,12 @@ describe("removeExports", () => {
       export const clientExport_2 = 123
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "export const clientExport_1 = 123;
     export const clientExport_2 = 123;"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("string", () => {
@@ -349,12 +349,12 @@ describe("removeExports", () => {
       export const clientExport_2 = 'string'
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "export const clientExport_1 = 'string';
     export const clientExport_2 = 'string';"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("string reference", () => {
@@ -370,13 +370,13 @@ describe("removeExports", () => {
       export const clientExport_2 = CLIENT_STRING
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "const CLIENT_STRING = 'CLIENT_STRING';
     export const clientExport_1 = CLIENT_STRING;
     export const clientExport_2 = CLIENT_STRING;"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 
   test("null", () => {
@@ -389,11 +389,11 @@ describe("removeExports", () => {
       export const clientExport_2 = null
     `,
       ["serverExport_1", "serverExport_2"]
-    );
-    expect(result).toMatchInlineSnapshot(`
+    )({});
+    expect(result.code).toMatchInlineSnapshot(`
     "export const clientExport_1 = null;
     export const clientExport_2 = null;"
   `);
-    expect(result).not.toMatch(/server/i);
+    expect(result.code).not.toMatch(/server/i);
   });
 });
diff --git a/packages/remix-dev/vite/remove-exports.ts b/packages/remix-dev/vite/remove-exports.ts
@@ -1,5 +1,7 @@
 // Adapted from https://github.com/egoist/babel-plugin-eliminator/blob/d29859396b7708b7f7abbacdd951cbbc80902f00/src/index.ts
 // Which was originally adapted from https://github.com/vercel/next.js/blob/574fe0b582d5cc1b13663121fd47a3d82deaaa17/packages/next/build/babel/plugins/next-ssg-transform.ts
+import type { GeneratorOptions } from "@babel/generator";
+
 import {
   type BabelTypes,
   type NodePath,
@@ -63,7 +65,8 @@ function isIdentifierReferenced(
 
 export const removeExports = (source: string, exportsToRemove: string[]) => {
   let document = parse(source, { sourceType: "module" });
-  let generateCode = () => generate(document).code;
+  let generateCodeAndSourceMaps = (opts: Partial<GeneratorOptions>) =>
+    generate(document, { ...opts, sourceMaps: true });
 
   let referencedIdentifiers = new Set<NodePath<BabelTypes.Identifier>>();
   let removedExports = new Set<string>();
@@ -213,7 +216,7 @@ export const removeExports = (source: string, exportsToRemove: string[]) => {
   if (removedExports.size === 0) {
     // No server-specific exports found so there's
     // no need to remove unused references
-    return generateCode();
+    return generateCodeAndSourceMaps;
   }
 
   let referencesRemovedInThisPass: number;
@@ -359,5 +362,5 @@ export const removeExports = (source: string, exportsToRemove: string[]) => {
     });
   } while (referencesRemovedInThisPass);
 
-  return generateCode();
+  return generateCodeAndSourceMaps;
 };