From a95e5fbc1813ee36b4d04f49ec67b370f873fedf Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 29 Nov 2023 07:57:45 +0900
Subject: [PATCH] fix(remix-dev/vite): make `installGlobals` opt-in for Vite
 dev (#8119)

Co-authored-by: Mark Dalgleish <mark.john.dalgleish@gmail.com>
---
 .changeset/tidy-timers-share.md         | 21 +++++++++++++++++++++
 docs/future/vite.md                     | 17 +++++++++++++++++
 packages/remix-dev/vite/node/adapter.ts |  3 ---
 templates/unstable-vite/vite.config.ts  |  3 +++
 4 files changed, 41 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/tidy-timers-share.md

diff --git a/.changeset/tidy-timers-share.md b/.changeset/tidy-timers-share.md
new file mode 100644
index 00000000000..44dc9ecf721
--- /dev/null
+++ b/.changeset/tidy-timers-share.md
@@ -0,0 +1,21 @@
+---
+"@remix-run/dev": patch
+---
+
+Remove automatic global Node polyfill installation from the built-in Vite dev server and instead allow explicit opt-in.
+
+**This is a breaking change for projects using the unstable Vite plugin without a custom server.**
+
+If you're not using a custom server, you should call `installGlobals` in your Vite config instead.
+
+```diff
+import { unstable_vitePlugin as remix } from "@remix-run/dev";
++import { installGlobals } from "@remix-run/node";
+import { defineConfig } from "vite";
+
++installGlobals();
+
+export default defineConfig({
+  plugins: [remix()],
+});
+```
diff --git a/docs/future/vite.md b/docs/future/vite.md
index 10049e54d59..54c68229406 100644
--- a/docs/future/vite.md
+++ b/docs/future/vite.md
@@ -147,6 +147,8 @@ Vite handles imports for all sorts of different file types, sometimes in ways th
 If you were using `remix-serve` in development (or `remix dev` without the `-c` flag), you'll need to switch to the new minimal dev server.
 It comes built-in with the Remix Vite plugin and will take over when you run `vite dev`.
 
+Unlike `remix-serve`, the Remix Vite plugin doesn't install any [global Node polyfills][global-node-polyfills] so you'll need to install them yourself if you were relying on them. The easiest way to do this is by calling `installGlobals` at the top of your Vite config.
+
 You'll also need to update to the new build output paths, which are `build/server` for the server and `build/client` for client assets.
 
 👉 **Update your `dev`, `build` and `start` scripts**
@@ -161,6 +163,20 @@ You'll also need to update to the new build output paths, which are `build/serve
 }
 ```
 
+👉 **Install global Node polyfills in your Vite config**
+
+```diff filename=vite.config.ts
+import { unstable_vitePlugin as remix } from "@remix-run/dev";
++import { installGlobals } from "@remix-run/node";
+import { defineConfig } from "vite";
+
++installGlobals();
+
+export default defineConfig({
+  plugins: [remix()],
+});
+```
+
 #### Migrating from a custom server
 
 If you were using a custom server in development, you'll need to edit your custom server to use Vite's `connect` middleware.
@@ -696,3 +712,4 @@ We're definitely late to the Vite party, but we're excited to be here now!
 [ssr-no-external]: https://vitejs.dev/config/ssr-options.html#ssr-noexternal
 [server-dependencies-to-bundle]: https://remix.run/docs/en/main/file-conventions/remix-config#serverdependenciestobundle
 [blues-stack]: https://github.com/remix-run/blues-stack
+[global-node-polyfills]: ../other-api/node#polyfills
diff --git a/packages/remix-dev/vite/node/adapter.ts b/packages/remix-dev/vite/node/adapter.ts
index 2957cc39c7d..204b649c28a 100644
--- a/packages/remix-dev/vite/node/adapter.ts
+++ b/packages/remix-dev/vite/node/adapter.ts
@@ -8,15 +8,12 @@ import { Readable } from "node:stream";
 import { splitCookiesString } from "set-cookie-parser";
 import {
   type ServerBuild,
-  installGlobals,
   createReadableStreamFromReadable,
 } from "@remix-run/node";
 import { createRequestHandler as createBaseRequestHandler } from "@remix-run/server-runtime";
 
 import invariant from "../../invariant";
 
-installGlobals();
-
 function createHeaders(requestHeaders: IncomingHttpHeaders) {
   let headers = new Headers();
 
diff --git a/templates/unstable-vite/vite.config.ts b/templates/unstable-vite/vite.config.ts
index 177dd59b27d..492e8c2080d 100644
--- a/templates/unstable-vite/vite.config.ts
+++ b/templates/unstable-vite/vite.config.ts
@@ -1,7 +1,10 @@
 import { unstable_vitePlugin as remix } from "@remix-run/dev";
+import { installGlobals } from "@remix-run/node";
 import { defineConfig } from "vite";
 import tsconfigPaths from "vite-tsconfig-paths";
 
+installGlobals();
+
 export default defineConfig({
   plugins: [remix(), tsconfigPaths()],
 });