search

Ionaru / easy-markdown-editor

EasyMDE: A simple, beautiful, and embeddable JavaScript Markdown editor. Delightful editing for beginners and experts alike. Features built-in autosaving and spell checking.
https://stackblitz.com/edit/easymde
MIT License
2.45k stars 319 forks source link

How can I highlight source code in code block? #404

Closed TechMaster closed 2 years ago

TechMaster commented 2 years ago

Hi,

I write a markdown article that has several code blocks of different programming languages. I want to hight light syntax of each code block in editor (WYSIWYG). What should I do ?

Do I need to customize CodeMirror or just configure EasyMDE?

image

Ionaru commented 2 years ago

Have a look at the codeSyntaxHighlighting option.

TechMaster commented 2 years ago

There are two highlight actions:

  1. When Editing
  2. When Preview

What I want is highlighting code block when editing markdown.

codeSyntaxHighlighting is for previewing. image

Ionaru commented 2 years ago

CodeMirror has no idea the code block is a code block until the markdown is parsed, so does not render it differently. I don't think it's possible to do without some editor hacking currently.

TechMaster commented 2 years ago

Thanks @Ionaru CodeMirror allows to highlight syntax code blocks in Markdown. I will try to modify your code and let you know if successfull.

EvanZhouDev commented 7 months ago

@TechMaster I know it's been a few years, but is there any chance that you were successful? I need this very feature 😅