Add example of mdx-editor with Remix V2 in ESM mode #1
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.
Preface
I had a really hard time configuring
'@mdxeditor/editor'
to run in ESM mode with Remix V2. I tried bundling every possible combination of dependencies inserverDependenciesToBundle
but none of them seemed to work.I finally arrived to the following solution: =>
Implementation
ClientOnly
fromremix-utils
. It behaves exactly the same as the previous implementation withSuspense
. Since the editor does not seem to work correctly without client-side JavaScript (i.e. the<Scripts />
inroot.tsx
), I'd argue that this is a fair alternative.editor.client.tsx
so the dependencies don't end up in the server bundle. (https://remix.run/docs/en/main/file-conventions/-client)Let me know if this is something you want to support. If not, then I hope this PR can be a reference for someone with the same struggles as I had!