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.

Sign up for GitHub

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

Update docs regarding SPA Template ssr.noExternal setting #8957

Merged
merged 2 commits into from
Mar 4, 2024
Merged

Update docs regarding SPA Template ssr.noExternal setting #8957

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
e0a7d13
Update docs regarding SPA Template ssr.noExternal setting
brophdawg11 Mar 1, 2024
bf62380
Updates
brophdawg11 Mar 4, 2024
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
5 changes: 2 additions & 3 deletions docs/future/spa-mode.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -228,8 +228,7 @@ startTransition(() => {
- Generally speaking, the way to resolve these issues is to import any browser-only libraries from `entry.client.tsx` so they don't end up in the server build
- Otherwise, you can generally solve these by using [`React.lazy`][react-lazy] or the [`<ClientOnly>`][client-only] component from `remix-utils`

- The [SPA Mode template][spa-mode-template] enables the Vite [ssr.noExternal][vite-ssr-noexternal] option by default to automatically bundle all of your dependencies during the server build to avoid most ESM/CJS issues
- This may slow down your build a bit — if so, you can try removing this option, or switching to a more targeted array containing the specific dependencies you wish to bundle
- If you are running into ESM/CJS issues with your app dependencies you may need to set the Vite [ssr.external][vite-ssr-external] and/or [ssr.noExternal][vite-ssr-noexternal] options in your config to exclude or include certain dependencies in your server bundle.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We may want to be more specific that noExternal will bundle the dependencies in your server bundle. I worry a bit that the language as it stands is going to encourage people to just flip a coin putting dependencies in ssr.external vs ssr.noExternal, whereas they really are always going to want to try ssr.noExternal (unless they set that to true, but that feels like the unhappy path at this point).

Also might be good to include a quick code snipped, in case they don't realize ssr is a top level key in the vite config.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

It's tricky to draw the line between how much we should explain vite stuff that's already documented on the vite pages we're linking too. Bring too much over and our docs get bloated and potentially stale. Bring too little over and folks who don't click through may not grok the point we're making. I'll push an update to try to make this a bit clearer though - and I agree the code snippet would be helpful

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

bf62380


## Migrating from React Router

Expand Down Expand Up @@ -273,5 +272,5 @@ Once you've got all your routes living in their own files, you can:
[client-only]: https://github.com/sergiodxa/remix-utils?tab=readme-ov-file#clientonly
[vite-preview]: https://vitejs.dev/guide/cli#vite-preview
[sirv-cli]: https://www.npmjs.com/package/sirv-cli
[spa-mode-template]: https://github.com/remix-run/remix/tree/main/templates/spa
[vite-ssr-noexternal]: https://vitejs.dev/config/ssr-options#ssr-noexternal
[vite-ssr-external]: https://vitejs.dev/config/ssr-options#ssr-external