Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(remix-dev/vite): make installGlobals opt-in for Vite dev #8119

Merged
merged 7 commits into from
Nov 28, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions .changeset/tidy-timers-share.md
Original file line number Diff line number Diff line change
@@ -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()],
});
```
17 changes: 17 additions & 0 deletions docs/future/vite.md
Original file line number Diff line number Diff line change
Expand Up @@ -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**
Expand All @@ -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.
Expand Down Expand Up @@ -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
3 changes: 0 additions & 3 deletions packages/remix-dev/vite/node/adapter.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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();

Expand Down
3 changes: 3 additions & 0 deletions templates/unstable-vite/vite.config.ts
Original file line number Diff line number Diff line change
@@ -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()],
});