remark-directive-emphasis-dots

这是一个为 Markdown 中文行内文本添加着重号的remark插件

安装

1npm install remark-directive-emphasis-dots

用例

1import rehypeFormat from 'rehype-format'
2import rehypeStringify from 'rehype-stringify'
3import remarkDirective from 'remark-directive'
4import remarkParse from 'remark-parse'
5import remarkRehype from 'remark-rehype'
6import { unified } from 'unified'
7import remarkDirectiveEmphasisDots from 'remark-directive-emphasis-dots'
8
9const text = ":emd[你好]，世界！"
10const file = unified()
11          .use(remarkParse)
12          .use(remarkDirective)
13          .use(remarkDirectiveEmphasisDots())
14          .use(remarkRehype)
15          .use(rehypeFormat)
16          .use(rehypeStringify)
17          .process(text)
18
19console.log((await file).toString())

这会产生如下输出：

<p><em class="emd">你好</em>，世界！</p>

之后，你可以通过自定义CSS来为最终的显示效果添加着重号效果，例如

1em.emd {
2 	font-style: normal;
3	text-emphasis: filled black;
4  text-emphasis-position: under right;
5}

自定义选项

可以通过向函数中传入配置来更改行为，配置的格式如下

...
.use(remarkDirectiveEmphasisDots{
  tag: 'emd', /* markdown 中的标记名 */
  hName: 'em', /* HTML 中的标签名 */
  classNames: ["emd"] /* 为 HTML 标签添加的类 */
})
...