使用Node.js开发一个静态博客生成器（三）——代码高亮

实现代码很简单，我们知道有highlight.js可以直接在浏览器中给pre标签中的代码加入高亮标签的样式，然后引入对于的高亮样式CSS文件即可，我们可以在使用任何程序的网站中使用这个库。
但是highlight.js经过压缩后还是有几十kb，同样，在浏览器中渲染HTML标签也会耗时耗资源，所以干脆在服务端（生成页面的时候）就给代码加上高亮样式，我这里举两个例子，分别是两个Markdown生成器的使用方法：

MarkdownIt

这是我现在在用的解析器，在生成md实例的时候可以直接启用highlight.js插件。

const MarkdownIt = require('markdown-it');
const hljs = require('highlight.js');
const md = new MarkdownIt({
  highlight: function(str, lang) {
    if (lang && hljs.getLanguage(lang)) {
      try {
        return '<pre><code class="hljs ' + lang + '">' +
          hljs.highlight(lang, str, true).value +
          '</code></pre>';
      } catch (__) {}
    }
    return '<pre><code>' + md.utils.escapeHtml(str) + '</code></pre>';
  }
});

然后使用md.render()方法解析MD时就会自动加上hljs的高亮样式了。

marked

这是另一款非常受欢迎的markdown解析器，我曾经也尝试使用过，相比markdownit，我认为它配置起来更加简单，同样，它也可以直接启用highlight.js拓展

const marked = require('marked');
const hljs = require('highlight.js');
marked.setOptions({
  highlight: (code) => hljs.highlightAuto(code).value,
})
marked(markdown)

昨日当年

使用Node.js开发一个静态博客生成器（三）——代码高亮

MarkdownIt

marked