uiwjs / react-md-editor

A simple markdown editor with preview, implemented with React.js and TypeScript.
https://uiwjs.github.io/react-md-editor
MIT License
2.15k stars 155 forks source link

Next.js problem while writing an article #608

Open BadmWe opened 9 months ago

BadmWe commented 9 months ago

Hello, I've added code from https://github.com/uiwjs/react-md-editor?tab=readme-ov-file#support-nextjs on my open-source website, but it doesn't work correctly. I have the strange blue line on the left side, and it's interferes with writing text further down the markdown.

My code here https://github.com/BadmWe/dspyt-webpage/blob/eb597c6452f9d9a9304f1f6fc4b1962c6c9680e1/dspyt/pages/markdown/index.js#L6-L74

Image

When I try to write a text further, I have this problem image

Actually, I tried to look at your finished code here image

https://codesandbox.io/embed/nextjs-example-react-md-editor-https-github-com-uiwjs-react-md-editor-issues-516-1z56px?fontsize=14&hidenavigation=1&theme=dark

But it doesn't work image

I have read through https://github.com/uiwjs/react-md-editor/issues/52 and think that

const MDEditor = dynamic(
  () => import("@uiw/react-md-editor"),
  { ssr: false }
);

messes up css

BadmWe commented 9 months ago

Now I have another problem, now with the cursor, look, it is not displayed correctly for one character image I clicked on the text at the end of the line, but the cursor remained one character ahead image

BadmWe commented 9 months ago

The same problem is right here https://uiwjs.github.io/react-md-editor/

image

BadmWe commented 9 months ago

hite

jaywcjlove commented 9 months ago

@BadmWe Style conflict

BadmWe commented 9 months ago

I fixed this problem using this highlightEnable={false}

OgDev-01 commented 8 months ago

Does the highlightEnabled={false} props fix the issue with the cursor position? cc: @BadmWe