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

Add example of mdx-editor with Remix V2 in ESM mode #1

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

KarelVerschraegen
Copy link

@KarelVerschraegen KarelVerschraegen commented Oct 29, 2023

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 in serverDependenciesToBundle but none of them seemed to work.

I finally arrived to the following solution: =>

Implementation

  • I configured the editor with some plugins as I had the most issues bundling them.
  • I switched to ClientOnly from remix-utils. It behaves exactly the same as the previous implementation with Suspense. Since the editor does not seem to work correctly without client-side JavaScript (i.e. the <Scripts /> in root.tsx), I'd argue that this is a fair alternative.
  • I created a new file 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!

@KarelVerschraegen KarelVerschraegen changed the title remix esm example client only Add example of mdx-editor with Remix V2 in ESM mode Oct 29, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant