Marked 开源项目教程

2024-08-16 18:02:49作者：范靓好Udolf

项目介绍

Marked 是一个用于解析 Markdown 的低级编译器，旨在快速且轻量级地实现所有支持的 Markdown 风格和规范。它可以在浏览器、服务器或命令行接口（CLI）中运行。Marked 不使用缓存，也不会长时间阻塞，确保了高效的解析性能。

项目快速启动

安装

通过 npm 安装

npm install -g marked

在浏览器中使用

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>Marked in the browser</title>
</head>
<body>
  <div id="content"></div>
  <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
  <script>
    document.getElementById('content').innerHTML = marked.parse('# Marked in the browser\n\nRendered by **marked**');
  </script>
</body>
</html>

使用 CLI

# 示例：使用标准输入
$ marked -o hello.html
hello world
^D
$ cat hello.html
<p>hello world</p>

应用案例和最佳实践

案例一：静态博客生成器

使用 Marked 可以轻松地将 Markdown 文件转换为 HTML，适用于构建静态博客。以下是一个简单的示例：

const fs = require('fs');
const marked = require('marked');

fs.readFile('post.md', 'utf8', (err, data) => {
  if (err) throw err;
  const html = marked.parse(data);
  fs.writeFile('post.html', html, (err) => {
    if (err) throw err;
    console.log('Post has been converted to HTML!');
  });
});

最佳实践

安全使用：由于 Marked 不 sanitize 输出 HTML，建议使用 DOMPurify 等库来处理输出，以防止 XSS 攻击。

const DOMPurify = require('dompurify');
const marked = require('marked');

const dirty = marked.parse(`<img src="x" onerror="alert('not happening')">`);
const clean = DOMPurify.sanitize(dirty);