Cannot use import statement outside a module | when using @uiw/react-markdown-editor about remix HOT 5 CLOSED

I'm also using Vite here, but I suspect the issue is with Remix. The Markdown editor works fine in a standalone Vite app without Remix.

Also getting this error message in StackBlitz
13:31:23 [vite] Error when evaluating SSR module virtual:remix/server-build:
|- SyntaxError: Cannot use import statement outside a module
at new AsyncFunction ()
at instantiateModule (file:///home/Vishal17199/remix-test/node_modules/vite/dist/node/chunks/dep-BKbDVx1T.js:56277:28)

13:31:23 [vite] Internal server error: Cannot use import statement outside a module
at new AsyncFunction ()
at instantiateModule (file:///home/Vishal17199/remix-test/node_modules/vite/dist/node/chunks/dep-BKbDVx1T.js:56277:28)

from remix.

Place the editor in Editor.client.tsx or any .client.tsx file. Example: https://github.com/arvigeus/format-code

Now there’s another issue: in that project it works, but today I tried it on a brand new project and it threw an error. It’s not the react-codemirror, it’s Remix - it was crashing on any .client.tsx file today. Latest version from the template. Does this affect you too?

from remix.

No @arvigeus , after placing the editor in Editor.client.tsx its working work me.
I am using

    @remix-run/dev: ^2.9.2 => 2.9.2 
    @remix-run/node: ^2.9.2 => 2.9.2 
    @remix-run/react: ^2.9.2 => 2.9.2 
    @remix-run/serve: ^2.9.2 => 2.9.2 
    vite: ^5.1.0 => 5.2.12

Thanks for the solution.

from remix.

Do you use remix-utils? I stumbled upon an interesting bug, but I cannot reproduce it reliably. One way to reproduce it for me was to import the editor directly in _index.tsx page. Or to open the page with the editor on a new tab. Try this if you have such a problem.

from remix.

no @arvigeus I am not using remix-utils so not sure about it.

from remix.