From 68ef9212361effff22c608b674d1ba2851ab693a Mon Sep 17 00:00:00 2001
From: Pedro Cattori <pcattori@gmail.com>
Date: Mon, 30 Oct 2023 17:40:31 -0400
Subject: [PATCH] fix(vite): remove server exports from resource routes

---
 .changeset/curvy-wasps-occur.md   |  5 +++
 integration/vite-build-test.ts    | 54 ++++++++++++++++++++++++++++++-
 packages/remix-dev/vite/plugin.ts | 14 --------
 3 files changed, 58 insertions(+), 15 deletions(-)
 create mode 100644 .changeset/curvy-wasps-occur.md

diff --git a/.changeset/curvy-wasps-occur.md b/.changeset/curvy-wasps-occur.md
new file mode 100644
index 00000000000..cb8525c97cb
--- /dev/null
+++ b/.changeset/curvy-wasps-occur.md
@@ -0,0 +1,5 @@
+---
+"@remix-run/dev": patch
+---
+
+fix server code interop for vite build
diff --git a/integration/vite-build-test.ts b/integration/vite-build-test.ts
index 245500697a5..e359101be46 100644
--- a/integration/vite-build-test.ts
+++ b/integration/vite-build-test.ts
@@ -1,4 +1,7 @@
+import * as path from "node:path";
 import { test, expect } from "@playwright/test";
+import shell from "shelljs";
+import glob from "glob";
 
 import {
   createAppFixture,
@@ -51,13 +54,25 @@ test.describe("Vite build", () => {
         `,
         "app/routes/_index.tsx": js`
           import { useState, useEffect } from "react";
+          import { json} from "@remix-run/node";
+
+          import { serverOnly1, serverOnly2 } from "../utils.server";
+
+          export const loader = () => {
+            return json({ serverOnly1 })
+          }
+
+          export const action = () => {
+            console.log(serverOnly2)
+            return null
+          }
 
           export default function() {
             const [mounted, setMounted] = useState(false);
             useEffect(() => {
               setMounted(true);
             }, []);
-            
+
             return (
               <>
                 <h2>Index</h2>
@@ -66,6 +81,24 @@ test.describe("Vite build", () => {
             );
           }
         `,
+        "app/routes/resource.ts": js`
+          import { json} from "@remix-run/node";
+
+          import { serverOnly1, serverOnly2 } from "../utils.server";
+
+          export const loader = () => {
+            return json({ serverOnly1 })
+          }
+
+          export const action = () => {
+            console.log(serverOnly2)
+            return null
+          }
+        `,
+        "app/utils.server.ts": js`
+          export const serverOnly1 = "SERVER_ONLY_1"
+          export const serverOnly2 = "SERVER_ONLY_2"
+        `,
       },
     });
 
@@ -76,6 +109,25 @@ test.describe("Vite build", () => {
     appFixture.close();
   });
 
+  test("server code is removed from client assets", async () => {
+    let publicBuildDir = path.join(fixture.projectDir, "public/build");
+
+    // detect client asset files
+    let assetFiles = glob.sync("**/*.@(js|jsx|ts|tsx)", {
+      cwd: publicBuildDir,
+      absolute: true,
+    });
+
+    // grep for server-only values in client assets
+    let result = shell
+      .grep("-l", /SERVER_ONLY_1|SERVER_ONLY_2/, assetFiles)
+      .stdout.trim()
+      .split("\n")
+      .filter((line) => line.length > 0);
+
+    expect(result).toHaveLength(0);
+  });
+
   test("server renders matching routes", async () => {
     let res = await fixture.requestDocument("/");
     expect(res.status).toBe(200);
diff --git a/packages/remix-dev/vite/plugin.ts b/packages/remix-dev/vite/plugin.ts
index 7dcf94d2353..2ce43a49e2c 100644
--- a/packages/remix-dev/vite/plugin.ts
+++ b/packages/remix-dev/vite/plugin.ts
@@ -632,20 +632,6 @@ export const remixVitePlugin: RemixVitePlugin = (options = {}) => {
 
         let serverExports = ["loader", "action", "headers"];
 
-        let routeExports = await getRouteModuleExports(
-          viteChildCompiler,
-          pluginConfig,
-          route.file
-        );
-
-        // ignore resource routes that only have server exports
-        // note: resource routes for fullstack components don't need a `default` export
-        // but still need their server exports removed
-        let browserExports = routeExports.filter(
-          (x) => !serverExports.includes(x)
-        );
-        if (browserExports.length === 0) return;
-
         return {
           code: removeExports(code, serverExports),
           map: null,