Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This is another draft PR with Vite support, but this one takes things a bit farther. I took a slightly more greenfield approach to this conversion and replaced the blog set up that is currently in place with one that is more Vite-native.
The Markdown/MDX content set up in this PR works very similarly to Astro's content collections. With the power of Vite's
import.meta.glob
, we can easily query our file system with a glob pattern at bundle-time for any files Vite understands and then extract content from them as if they were being dynamically imported. This allows us to use Vite's build pipeline to compile our MDX into a React component and all the niceties that come along with that (auto file watching, hot module reloading, etc.). This also means we only need to run the Vite process for dev and build, rather than having helper processes alongside.This PR also includes a swap of Zod for Valibot, for it's superior bundle size and tree-shakability, since validation will now happen on the client as well.
I'm still struggling to figure out how to make mocks work with ES modules and I haven't spent enough time figuring out how to modify the existing tests to work with this new setup/code yet, but this PR solves almost all of issues with my previous Vite PR:
"dev:remix": "binode --import ./mocks/index.js -- vite"
); when I originally tried this, I got ESM compatibility errors, so I just removed the mocks loader from the dev commandtsc
complains aboutimport.meta
usage, even though thetsconfig.json
is configured correctly for Vite, so I had to disable the call totsc
in thevalidate:precommit
script in order to make this commitThe types for thesync-directory
package are vended incorrectly and TypeScript complains about them; I added@ts-expect-error
at each import site to get around thisFor some reason, Vite is trying to resolve a module fromnode_modules/@esbuild-plugins/node-resolve/esm/index.js
; The error message says to mark it as external, but it's still throwing the errorCould not resolve "builtin-modules"
, even when it's marked as external inbuild.rollupOptions.external
; This error doesn't seem to actually impact any functionalityWithout using the@vitejs/plugin-react
plugin, theReact
global is used in the JSX transform (e.g.React.createElement
) without an import, causingReferenceError: React is not defined
errorsIncluding the official React plugin causes a client-side error during dev (Uncaught SyntaxError: Identifier 'RefreshRuntime' has already been declared
) due to multiple versions of the React Refresh (HMR) Runtime being loaded: one by the Remix plugin and one by the React plugin.Building the site for production with the official React plugin and running it withremix-serve
causes an error:TypeError: jsxDEV is not a function
; Building the site for production without the official React plugin and running it withremix-serve
causes a different error:ReferenceError: React is not defined
Unicode on the site is not being rendered correctly: the 💿 emoji in the<nav>
and<title>
is being rendered as💿
and the © symbol in the<footer>
is being rendered as©
I know this is a big departure from the previous architecture, so I'll leave this as a draft along with my previous Vite PR. When we're ready to move to Vite, let me know which direction we want to go and I'll focus more on that PR (or maybe even put up a third for Strapi support?)