hexojs / hexo-renderer-markdown-it

Markdown-it is a Markdown parser, done right. A faster and CommonMark compliant alternative for Hexo.
MIT License
349 stars 60 forks source link

Support for custom syntax highlighting #12

Closed dorny closed 4 years ago

dorny commented 9 years ago

Hi,

this patch will allow user to provide custom function or module for syntax highlighting. Markdown-it uses by default highlightjs. It's not bad but there are better solutions, for example CodeMirror.

API change: new highlight option: must be function(source, lang) -> string or name of available module which exports such function.

For testing purpose I've added highlighting using codemirror to dev dependencies.

coveralls commented 9 years ago

Coverage Status

Coverage remained the same at 100.0% when pulling 46f5f13ed9a00aa7576fd1d7fad9066ab2011b77 on dorny:master into 81c53bc02e1b0b434ef67f8bb28975a5eb3b36e4 on celsomiranda:master.

coveralls commented 9 years ago

Coverage Status

Coverage remained the same at 100.0% when pulling 46f5f13ed9a00aa7576fd1d7fad9066ab2011b77 on dorny:master into 81c53bc02e1b0b434ef67f8bb28975a5eb3b36e4 on celsomiranda:master.

celsomiranda commented 9 years ago

This plugin is using the highlight function from Hexo, not the markdown-it default implementation. Because of this, we should also add a check to see if the hexo highlight is disabled before applying the custom functions.

I have some reservations towards this as it adds some complexity to the renderer.

dorny commented 9 years ago

Ok I've missed that part. I haven't seen it in the code and didn't checked how it actually works inside hexo. I will look at it and uptade or close this PR latter.

celsomiranda commented 9 years ago

Ok thanks.

dorny commented 9 years ago

Hexo highlighting if enabled takes place even before markdown rendering. It's implemented as filter and replaces all backtick code blocks with marker inside html comment. So if hexo highlighting is enabled your renderer won't get any backtick code block to apply any highlighting. Since html tags in markdown are directly written to output, hexo probably latter replaces all markers with generated html.

Hexo highlighting can be disabled in config and markdown-it itself has an option to supply highlighting function so I would say this patch could be merged as is. At least I will use it this way for now. What do you think?

celsomiranda commented 9 years ago

You're right, but nevertheless we should print a warning to the prompt if hexo highlight is enabled, to prevent confusion.

dorny commented 9 years ago

if (this.cofnig.highlight.enabled) console.warn(...) would do the job...

However now I'm considering achieving my goals via separate plugin using filter the same way as hexo do. This way highlightling would be available for any renderer and it would also be possible to wrap generated code to by fully compatible with any codemirror theme out of the box. Please keep this open for now.

curbengh commented 4 years ago

It's now possible to override the default syntax highlighting after #121.

highlight.js and prismjs bundled with Hexo should be disabled first:

# _config.yml
highlight:
  enable: false # enabled by default
prismjs:
  enable: false

In the "scripts/" folder, create a new .js file (can be any name):

hexo.extend.filter.register('markdown-it:renderer', function(md) {
  md.set({
    highlight: function(str, lang) {
      if (lang === 'foo') {
        return '<foo>' + md.utils.escapeHtml(str) + '</foo>'
      }
      return '<pre class="hljs"><code>' + md.utils.escapeHtml(str) + '</code></pre>';
    }
  })
});