starwait/docs/f01-mrkdown/01-marked.md
2025-04-28 18:02:35 +08:00

3.0 KiB
Raw Blame History

marked 是一个流行的前端 Markdown 解析库,具有以下特色功能:

github star 34.5k

https://marked.js.org/

demo:

1. 轻量级

  • marked 是一个非常轻量级的库,压缩后的文件大小通常只有几十 KB适合在浏览器和 Node.js 环境中使用。

2. 高性能

  • marked 的解析速度非常快,能够在短时间内将 Markdown 文本转换为 HTML。它通过一次解析完成所有转换避免了多次遍历的开销。

3. 可扩展性

  • marked 提供了丰富的 API允许开发者自定义解析规则、渲染器、语法高亮等功能。你可以通过扩展或覆盖默认的渲染器来实现自定义的 Markdown 解析逻辑。

4. 支持 CommonMark 和 GitHub Flavored Markdown (GFM)

  • marked 支持 CommonMark 标准,并且还支持 GitHub Flavored Markdown (GFM),包括表格、任务列表、自动链接等扩展语法。

5. 语法高亮

  • marked 内置支持语法高亮,可以通过配置使用 highlight.js 或其他语法高亮库来为代码块添加高亮效果。

6. 异步渲染

  • marked 支持异步渲染,允许在解析过程中执行异步操作(如获取远程资源),并返回 Promise 对象。

7. 安全性

  • marked 默认会对输出的 HTML 进行转义,防止 XSS跨站脚本攻击等安全问题。你可以通过配置禁用或自定义转义行为。

8. 支持自定义 Tokenizer 和 Renderer

  • marked 允许开发者自定义 Tokenizer 和 Renderer从而可以灵活地处理 Markdown 中的各种元素。例如,你可以自定义如何渲染标题、链接、图片等。

9. 支持插件

  • marked 支持通过插件扩展功能,社区中有许多插件可以进一步增强 marked 的功能,如支持数学公式、流程图等。

10. 跨平台

  • marked 可以在浏览器和 Node.js 环境中使用,适用于各种前端和后端项目。

11. 丰富的配置选项

  • marked 提供了丰富的配置选项,允许开发者根据需要调整解析和渲染行为。例如,可以配置是否启用 GFM、是否自动生成锚点等。

12. 良好的社区支持

  • marked 拥有活跃的社区和丰富的文档,开发者可以轻松找到相关的教程、示例和插件。

示例代码

const marked = require('marked');

// 基本用法
const html = marked('# Hello, World!');
console.log(html); // 输出: <h1>Hello, World!</h1>

// 自定义渲染器
const renderer = new marked.Renderer();
renderer.heading = function (text, level) {
  return `<h${level} class="custom-heading">${text}</h${level}>`;
};

marked.setOptions({ renderer });

const customHtml = marked('# Custom Heading');
console.log(customHtml); // 输出: <h1 class="custom-heading">Custom Heading</h1>

总结

marked 是一个功能强大且灵活的 Markdown 解析库,适合各种需要 Markdown 解析的场景。它的高性能、可扩展性和丰富的功能使其成为前端开发者的首选工具之一。