我们知道Hexo博客默认的markdown渲染引擎hexo-renderer-marked
是不支持emoji渲染的,如果hexo博客需要支持emoji,我们需要更换其markdown渲染引擎为hexo-renderer-markdown-it
,然后安装markdown-it-emoji
插件,最后更改站点的markdown配置即可。
步骤
- 首先卸载
hexo-renderer-marked
,一定要卸载,不然hexo还是会默认选择这个作为markdown渲染引擎,如果卸载报错,删除package.json
中hexo-renderer-marked
这一行然后删除node_module
重新安装依赖就好啦
1 | npm un hexo-renderer-marked -S |
- 安装
hexo-renderer-markdown-it
和markdown-it-emoji
1 | npm i hexo-renderer-markdown-it markdown-it-emoji -S |
- 更改站点的markdown配置,注意是根目录里站点的配置而不是主题设置哦
1 | markdown: |
至此就大工告成啦,来试试!🐯 🎉
同时支持如emoji编码编译如:tiger:
这种,以及输入法带的emoji表情两种编译哦!
补充:踩坑记录
在做这个emoji支持设置的时候,也看了好几个网上的文章,都是这样写的配置:
1 | markdown: |
注意最后一行permalinkSymbol
的设置,经过我的摸索后,发现这个是设置anchors
锚点,即文章的TOC目录展现的锚点链接标志,如果按这样设置,会发现你的目录长这样:

toc
链接前面加上了这个很丑的标志,我很好奇为什么那么多博文为什么都这样写,我就不信这个邪,没有写上面anchors
锚点相关配置试了试,发现跑起来,好多文章都页面空白并报错:

toc-error
看来是不能删除这个配置了,可是又不想看到这个丑陋的标志,于是我试了下设置permalinkSymbol: ''
,即设置他为空,发现成功跑起来并正确渲染无报错啦(正如本文所示)!
再补充:hexo-renderer-markdown-it介绍
hexo-renderer-markdown-it
是一款用于 Markdown 解析和渲染的插件,最大的几个特性如下
- 用于替换 Hexo 默认自带的 Markdown 渲染器(比
hexo-renderer-marked
更快)。 - 提供了更丰富的 Markdown 解析和渲染。
- 提供数学公式Latex支持
- 支持上标sup,下标sub
在浏览器官方Git仓库的时候我发现官方教程配置:

mardown-default
这里就用了¶这个符号,难怪这么多博文都用了这个丑陋的符号,这锅得官方背呀!😂 😂