search

writemonkey / wm3

165 stars 5 forks source link

Code Block Issues #367

Open sadnamakemono opened 4 years ago

sadnamakemono commented 4 years ago

I am running into two issues with using code blocks. Here is an image with the editor on the left, and HTML preview on the right:

image

Comments inside code blocks seem to be a bit wonky, as you can see above. It seems the raw HTML is being rendered instead of the comment itself?

Also, it seems as though I can't get code highlighting to work in either the editor, HTML preview, or in the browser. The only way I can get some form of highlighting is by loading highlight.js and the languages and supports by adding something like:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/styles/dracula.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/highlight.min.js"></script>
<script charset="UTF-8"
src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/languages/javascript.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

to the document. However, this only works when opening the HTML doc in the browser. It doesn't work in the editor or HTML preview. Is code highlighting not provided out of the box, or am I missing something? If it is not provided, is there a better workaround to get it working? I see that CodeMirror is used for syntax highlighting, but I wasn't sure how to use it in order to add syntax highlighting for code blocks. I am definitely willing to learn something and dig into the code, but I'm honestly quite new to the web dev scene so I'm a little lost.

Thank you for reading!

writemonkey commented 4 years ago

Hi, I see the problem with comments inside code blocks, thanks for pointing this out. Code highlighting in md code blocks is not supported at this time. Making it work in editor and preview/export would require separate solutions. i.