什么是@menubar/markup-it
@menubar/markup-it 是一个 Node.js 库,是一个用于解析和转换 Markdown 语言的 npm 包。它允许您将文本转换为 HTML 或 React 组件,并且还可以将 HTML 或 React 组件转换为文本。这个库的优点是它具有针对 Markdown 的高度可配置性以及兼容性。
安装
在终端中运行以下命令:
--- ------- ------------------
用法
解析 Markdown
----- - ------ - - ------------------------------ ----- -------- - - - ------ ----- ---- -- -------- ----- - ---- - - ---- - -- ----- ----- - ------------------------------- ----- ------- - -------------------- ----------------------------
将输出以下内容:
- ------ - - ----- -------- ----- ------------- ------ -- ----- ------- ------- -- ----- ------- ------- ------ -- -- -- -- - ----- -------- ----- ------------ ------ -- ----- ------- ------- - - ----- ----- -- -- ------ -- -- - ----- ------- ------ - - ----- ------ - - -- - ----- - ------- ------ -- - - -- -- - ----- -------- ----- ------------ ------ -- ----- ------- ------- -- ----- ----- --- ------ -- -- -- -- - ----- -------- ----- ------------ ------ -- ----- ------- ------- -- ----- ----- --- ------ -- -- -- - - -
将 Markdown 转换为 HTML
----- - ------ - - ------------------------------ ----- - ---- - - ------------------------------------------------ ----- -------- - - - ------ ----- ---- -- -------- ----- - ---- - - ---- - -- ----- ----- - ------------------------------- ----- ------- - -------------------- -------------------------------------
将输出以下 HTML:
---------- ---------- ------- -- --------------------- --------- ---- -------- ------ -------- ------ -----
将 Markdown 转换为 React 组件
----- - ------ - - ------------------------------ ----- - ----- - - ------------------------------------------------- ----- -------- - - - ------ ----- ---- -- -------- ----- - ---- - - ---- - -- ----- ----- - ------------------------------- ----- ------- - -------------------- -----------------------------------
将输出以下 React:
----- ---------- ---------- ------- -- --------------------- --------- ---- -------- ------ -------- ------ ----- ------
将 HTML 转换为 Markdown
----- - ------ - - ------------------------------ ----- - ---- - - ------------------------------------------------ ----- ----------- - - ---------- ---------- ------- -- --------------------- --------- ---- -------- ------ -------- ------ ----- -- ----- ----- - ---------------------------------- ----- ------- - -------------------- -------------------------------------
将输出以下 Markdown:
- ------ ----- ---- -- -------- ----- - ---- - - ---- -
将 React 组件转换为 Markdown
----- - ------ - - ------------------------------ ----- - ----- - - ------------------------------------------------- ----- ------------ - - ----- ---------- ---------- ------- -- --------------------- --------- ---- -------- ------ -------- ------ ----- ------ -- ----- ----- - ------------------------------------ ----- ------- - -------------------- -------------------------------------
将输出以下 Markdown:
- ------ ----- ---- -- -------- ----- - ---- - - ---- -
配置
@menubar/markup-it 具有高度可配置性,您可以选择各种选项来为其提供自定义行为。以下是选项列表:
commonmark
(default:true
):是否启用 CommonMark 缩写语法。footnote
(default:true
):是否启用脚注语法。gfm
(default:true
):是否启用 Github Flavored Markdown 扩展。heading1
(default:false
):是否将#
解析为header-one
类型的块级元素。hardlinebreak
(default:false
):是否将单个换行符解析为硬换行符。softbreak
(default:false
):是否将行末空格和制表符解析为软换行符。strikethrough
(default:true
):是否启用删除线语法。table
(default:true
):是否启用表格语法。
要将选项传递给解析器,您需要在调用 parser.stateFromText()
或 parser.stateFromHTML()
时将其作为第二个参数传递,如下所示:
----- - ------ - - ------------------------------ ----- -------- - - - ------ ----- ---- -- -------- ----- - ---- - - ---- - -- ----- ----- - ------------------------------ - ---- ----- --- ----- ------- - --------------------
结论
@menubar/markup-it 提供了一种高度可配置的 Markdown 解析器,可以很好地适用于您的项目。它使您能够轻松地将 Markdown 转换为 HTML 或 React 组件,并反之亦然。使用它全面认真地阅读其官方文档即可进行操作。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/600573a481e8991b448e99e4