替换为 markdown-it

今天在迁移博客项目的时候,发现原来在 hugo 中可以使用的 Emoji 和 tasks 功能都不能正常使用了,查询了一下原因,主要是因为 hexo 默认的解析器是 hexo-renderer-marked ,这个默认的渲染器是不支持 emoji 功能的,但是支持 tasks,但是这个渲染器是不支持扩展的,所以如果希望同时使用这两个功能的话,就需要换一个渲染器。

这里推荐的是 hexo-renderer-markdown-it 渲染器,支持扩展,采用的是 markdown-it 的内核来解析 markdown 的文本。

npm un hexo-renderer-marked -S
npm i hexo-renderer-markdown-it -S

安装和配置 markdown-it

这样就替换完成了,然后再安装需要的插件:

npm i markdown-it-emoji markdown-it-task-lists -S

然后再增加相关配置:

markdown:
render:
html: true # 在 markdown 文本中支持 html tag 标签
xhtmlOut: false # 需要 xtml 文档,使用 <br /> 替代 <br>
breaks: true # 用 <br> 开始新的一行
linkify: true # 自动将 可能是链接的内容转换成链接
typographer: true # 印刷标识转换
plugins:
- markdown-it-abbr
- markdown-it-footnote
- markdown-it-ins
- markdown-it-sub
- markdown-it-sup
- markdown-it-emoji
- markdown-it-task-lists
anchors:
level: 2
collisionSuffix: ''
permalink: false,
permalinkClass: 'header-anchor'
permalinkSymbol: ''
case: 0
separator: ''

typographer 解释:

将 (c) (C) (r) (R) (tm) (TM) (p) (P) +- 这些标识转换成 (c) (C) (r) (R) (tm) (TM) (p) (P) +- 。

一些常用的插件,比如上标和下标,可以在插件里加上 markdown-it-sub 和 markdown-it-sup ,可以直接用 19^th^ 19th 还有 H~2~O 表示 H2O 。

还有脚本、定义列表等功能,具体的见 https://markdown-it.github.io/ 。

其它插件

因为 markdown-it 是支持扩展的,所以怎么找对应的扩展,也是非常重要的功能,比如 tasks 的支持,可以到 https://www.npmjs.com/ 里进行搜索,关键字是 keywords:markdown-it-plugin 或者直接打开链接 https://www.npmjs.com/search?q=keywords:markdown-it-plugin 。

就可以按照对应的功能去找寻找插件了。

Hexo 中使用 emoji 和 tasks的更多相关文章

  1. Hexo中添加emoji表情

    国庆的三天假前,都是玩CF和LOL的无限乱斗过来的,输了怨没随机到好的英雄,赢了就高高兴兴的

  2. MySQL中支持emoji表情的存储

    由于需要实现emoji表情评论的功能,所以数据库需要支持emoji表情的存储,根据查询的资料最终实现了该功能,现将实现的过程以及过程遇到的一些问题记录下来,供大家参考和交流. mysql的utf8编码 ...

  3. 去除字符串中的emoji字符

    对于使用utf8编码的mysql数据库来说,如果字符串中存在emoji小图像,是不能存进数据库中的,查了一下,原因大概是因为utf8编码可以存1-3个字节的字符,但是emoji是4个字节:解决方法可以 ...

  4. php开发中处理emoji表情和颜文字的兼容问题

    背景:随着手机的普及,现在移动开发很火爆,已经远远超过了pc端.在移动设备经常会发生用户发送的内容中包含emoji表情,在显示时就是乱码.一般是因为Mysql表设计时,都是用UTF8字符集的.把带有e ...

  5. 过滤NSString中的Emoji

    有时候由于项目需求.要过滤NSString中的emoji. 比方下面情况: 要跟android互通,android假设还没做这方面的支持. 内容做为手机短信发出去. 思路例如以下,遍历NSString ...

  6. 在MD中使用Emoji

    mark语法中支持emoji表情 具体语法是:emoji: 比如我输入 :smile: 就会出现微笑

  7. 移除微信昵称中的emoji字符

    移除微信昵称中的emoji字符: /** * 移除微信昵称中的emoji字符 * @param type $nickname * @return type */ function removeEmoj ...

  8. 如何在个人博客引擎 Hexo 中添加 Swiftype 搜索组件

    在您现在看到的我的博客站点,后台使用的是 Hexo 作为博客引擎,但是默认集成的搜索组件是进行 form 提交到 Google 进行搜索的,为了更好地体验,本文介绍如何在 Hexo 博客中集成 Swi ...

  9. 项目中使用emoji表情包与表情的解析过程详情

    菜鸡一只,刚开始写博客文笔不好,有问题欢迎相互讨论.闲话不多说. 用到了三个插件 Emoji Picker 第一步 这个emoji表情包插件是我找到比较好 的一个,input框中是不能放入图片的,效果 ...

随机推荐

  1. SQL server无法绑定由多个部分绑定的标示符

    原因https://blog.csdn.net/wolfalcon/article/details/54578215给了我启发,原来有犯错在insert和update的使用上了对于已存在的表(表中有字 ...

  2. typescript基础语法--变量/函数/指令/类

    博客地址 :https://www.cnblogs.com/sandraryan/ 要把ts文件引入到html中,首先要转码为js文件. 步骤: 终端运行: npm i -g typescript t ...

  3. Unity 鼠标控制视角功能和动画播放冲突解决办法

    环境是 unity 5.6.4 情况说明: 1 模型动画单独播放是没问题的. 2 鼠标控制模型是没问题的. 3 在start中播放模型动画,即使鼠标控制视角代码还挂载着,但是模型却无法用鼠标旋转等操作 ...

  4. PHP 面试题二

    1.抓取远程图片到本地,你会用什么函数? fsockopen, A 2.用最少的代码写一个求3值最大值的函数. function get_max($a,$b,$c) { return ($a > ...

  5. Java中的元注解

    注解为我们在代码中添加信息提供了一种形式化的方法,使我们可以在稍后某个时刻非常方便地使用这些数据. 通过使用注解,我们可以将这些元数据保存在Java源代码中,并利用annotation API为自己的 ...

  6. Html5 @media + css3 媒体查询

    css3 media媒体查询器用法总结   随着响应式设计模型的诞生,Web网站又要发生翻天腹地的改革浪潮,可能有些人会觉得在国内IE6用户居高不下的情况下,这些新的技术还不会广泛的蔓延下去,那你就错 ...

  7. Vmware虚拟机用户密码忘记了怎么办?

    Vmware虚拟机用户密码忘记了怎么办?   虚拟机Linux上用户密码忘记了怎么办? 今天准备再学习一下linux操作系统,由于之前已经安装过vaware和linux(redhat),所以这次认为不 ...

  8. Ultra-QuickSort——[归并排序、分治求逆序对]

    Description In this problem, you have to analyze a particular sorting algorithm. The algorithm proce ...

  9. ASP.NET MVC 实现页落网资源分享网站+充值管理+后台管理(1)之数据库设计

    本文主要讲解本项目网站所应用到的知识点,及数据库的相关设计: 一.知识点 (1)本项目主要采取ASP.NET MVC的编程模式,相信你已经了解到了MVC的具体含义是什么,这里不再赘述,有不了解的朋友, ...

  10. <mvc:annotation-driven /><context:annotation-config/><context:component-scan/>

    <context:annotation-config/> 隐式地向 Spring容器注册AutowiredAnnotationBeanPostProcessor. RequiredAnno ...