我的博客

测试ing...

hexo官方插件-hexo renderer markdown it

Build Status npm version npm dependencies Coverage Status

这个渲染插件使用 Markdown-it 作为 Hexo 的渲染引擎. 添加对 Markdown 和 CommonMark 的支持。

主要特色

  • 支持 Markdown, GFM 和 CommonMark
  • 广泛的配置
  • 比默认 hexo-renderer-marked 渲染器更快
  • Safe ID for headings
  • Anchors for headings with ID
  • 脚注
  • <sub> H2O
  • <sup> x2
  • <ins> Inserted

安装

警告： 在开始下面的教程前，确保你在hexo博客主目录下。
Hexo默认使用marked渲染器插件作为markdown渲染器，所以安装hexo-renderer-markdown-it之前必须先卸载它。

卸载marked
1
$ npm un hexo-renderer-marked --save

如果你已经卸载默认的markdown渲染器和其他你自己可能安装的markdown渲染器，就可以安全安装hexo-renderer-markdiwn-it了。

安装markdown it
1
$ npm i hexo-renderer-markdown-it --save

选项

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
markdown:
  render:
    html: true
    xhtmlOut: false
    breaks: true
    linkify: true
    typographer: true
    quotes: '“”‘’'
  plugins:
  anchors:
    level: 2
    collisionSuffix: ''
    permalink: false
    permalinkClass: 'header-anchor'
    permalinkSide: 'left'
    permalinkSymbol: '¶'
    case: 0
    separator: ''

简单的配置

配置渲染器是一项相当简单的任务，因为所有设置都在hexo的_config.yml主文件中。您只需要在您喜欢的文本编辑器中将其打开并写下您的配置即可。
最简单的方法是使用markdown-it已经提供的默认值。但是首先，您必须选择要使用的设置。

预设

Zero

Zero设置将禁用大多数解析器功能。仅在仅需要支持斜体和粗体显示时，才应使用此模式。渲染器甚至不支持所有原始的Markdown功能。
要启用Zero模式，您的_config.yml必须如下所示：

1
2
3
# Markdown-it config
## Docs: https://github.com/celsomiranda/hexo-renderer-markdown-it/wiki/
markdown: 'zero'
Default(GFM)

使用default选项将使解析器的行为类似于github规范。
要启用此模式，您的_config.yml应该如下所示：

1
2
3
# Markdown-it config
## Docs: https://github.com/celsomiranda/hexo-renderer-markdown-it/wiki/
markdown: 'default'
CommonMark

CommonMark为您提供了比“Zero”预设更多一点功能。此设置将强制插件使用最新的CommonMark规范。过去，我将其称为CommonMark严格模式，因为这是启用此预设时插件将执行的操作。它将为您提供CommonMark，仅此而已。
要启用此模式，您的_config.yml应该如下所示：

1
2
3
# Markdown-it config
## Docs: https://github.com/celsomiranda/hexo-renderer-markdown-it/wiki/
markdown: 'commonmark'

警告： 选择任何这些预设将阻止您使用任何随附的插件。

进阶配置

使用hexo-renderer-markdown-it，您可以将非常特定的配置传递给Markdown-it解析器。

可用设置（解释）

html

html设置定义文档中的HTML内容是否应转义或传递到最终结果。

1
2
3
html: true # 不要转义HTML内容
    ## 或者
html: false # 转义HTML内容，那么<标签>会显示为文本
xhtmlOut

xhtmlOut设置定义解析器是否将导出与XHTML完全兼容的标记。仅对完整的 CommonMark 支持才需要为true。

1
2
3
4
5
xhtmlOut: true # Parser produces fully XHTML compliant code.
               # Ex: A line breaks will be <br />
    ## OR
xhtmlOut: false # Parser will not produce XHTML compliant code.
                # Ex: A line break will be <br>
breaks

使源文件中的换行符将被解析为<br>标记。因此，每次按Enter键都会创建一个换行符，这不是默认的Markdown，CommonMark或GFM行为。

1
2
3
4
breaks: true # 每次源文件有换行，解析器都会产生 `<br>` 标签 
    ## 或者
breaks: false # 解析器将会忽略源文件中的换行
              #默认两次换行创建段落依然生效
linkify

解析器可以内联直接粘贴到文本中的链接。如果您写的一段文本看起来像一个链接，它将被渲染为<a src="http://example.com">http://example.com</a> 。

1
2
3
linkify: true # Returns text links as proper links inlined with the paragraph.
    ## OR
linkify: false # Returns text links as text.
typographer

这样可以替代常见的排版元素，例如©，弯引号，破折号等。

1
2
3
typographer: true # Substitution of common typographical elements will take place.
    ## OR
typographer: false # No substitution, so dumb quotes will remain dumb quotes, etc.
quotes

如果将typographer设置为true，则定义用于替换dumb quotes的双引号和单引号。

1
2
3
4
5
quotes: '“”‘’' # "double" will be turned into “single”
               # 'single' will be turned into ‘single’
    ## OR
quotes: '«»“”' # "double" will be turned into «single»
               # 'single' will be turned into “single”
配置示例
1
2
3
4
5
6
7
8
9
10
# Markdown-it config
## Docs: https://github.com/celsomiranda/hexo-renderer-markdown-it/wiki
markdown:
  render:
    html: true
    xhtmlOut: false
    breaks: false
    linkify: true
    typographer: true
    quotes: '“”‘’'

自动标题ID

使您能够自动为标题创建ID，以便您可以链接回它们。由于有效的html文档不能包含两个具有相同ID的元素，因此将对照已给定的其他ID来检查添加的每个标题ID。
如果已经提供了titleID，则会将后续ID更改为title-v2，title-v3等。
v是默认的collisionSuffix，您可以更改。
像这样在全局_config.yml中启用它们：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
markdown:
  anchors:
    # Minimum level for ID creation. (Ex. h2 to h6)
    level: 2
    # A suffix that is prepended to the number given if the ID is repeated.
    collisionSuffix: ''           
    # If `true`, creates an anchor tag with a permalink besides the heading.
    permalink: false              
    # Class used for the permalink anchor tag.
    permalinkClass: header-anchor 
    # The symbol used to make the permalink
    permalinkSymbol: 
    # Transform anchor to (1) lower case; (2) upper case
    case: 0
    # Replace space with a character
    separator: '-'

插件

可用插件

  • markdown-it-abbr
  • markdown-it-footnote
  • markdown-it-ins
  • markdown-it-sub
  • markdown-it-sup
    这些可以在全局_config.yml中启用，如下所示：
1
2
3
4
5
6
7
markdown:
  plugins:
    - markdown-it-abbr
    - markdown-it-footnote
    - markdown-it-ins
    - markdown-it-sub
    - markdown-it-sup

所有选项配置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
# Markdown-it config
## Docs: https://github.com/celsomiranda/hexo-renderer-markdown-it/wiki
markdown:
  render:
    html: true
    xhtmlOut: false
    breaks: true
    linkify: true
    typographer: true
    quotes: '“”‘’'
  plugins:
    - markdown-it-abbr
    - markdown-it-footnote
    - markdown-it-ins
    - markdown-it-sub
    - markdown-it-sup
  anchors:
    level: 2
    collisionSuffix: 'v'
    permalink: true
    permalinkClass: header-anchor
    permalinkSymbol:

测试

H2O

参考链接

hexo 测试