从Kramdown迁移至Marked | AI生成和翻译
要将你的 Jekyll 博客从 Kramdown 切换到 Marked，你需要对 Jekyll 配置和设置进行一些调整。Marked 是一个用于解析和编译 Markdown 的 JavaScript 库，它可以与 MathJax 结合使用以实现更好的数学公式渲染。以下是详细的切换步骤：
步骤 1：安装 Marked
首先，你需要在 Jekyll 项目中引入 Marked 库。可以通过在布局文件（如 default.html）的 <head> 部分添加以下代码来实现：
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
步骤 2：禁用 Kramdown
在 _config.yml 文件中，通过将 markdown 选项设置为 none 来禁用 Kramdown，或者如果之前设置为 Kramdown，直接移除该设置即可。
markdown: none
步骤 3：配置 Marked 与 MathJax
你需要配置 Marked 以使其与 MathJax 协同工作。在 Jekyll 项目中创建一个 JavaScript 文件（例如 marked-mathjax.js），并包含以下代码：
document.addEventListener("DOMContentLoaded", function() {
// 使用 Marked 渲染 Markdown 内容
const elements = document.querySelectorAll('.markdown-content');
elements.forEach(element => {
const html = marked(element.textContent);
element.innerHTML = html;
});
// 渲染 MathJax
MathJax.typesetPromise().then(() => {
console.log('MathJax 渲染完成！');
}).catch((err) => console.log('排版失败：', err));
});
在布局文件中引入 Marked 和 MathJax 之后，再引入此脚本：
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
<script src="/assets/js/marked-mathjax.js"></script>
步骤 4：更新 Markdown 内容
确保你的 Markdown 内容被包裹在一个带有 markdown-content 类的容器中，以便 JavaScript 能够定位并渲染它。
<div class="markdown-content">
<!-- 你的 Markdown 内容在这里 -->
</div>
步骤 5：测试你的设置
在本地构建并启动 Jekyll 站点，以确保 Marked 正确渲染了你的 Markdown 内容，并且 MathJax 能够正常显示数学公式。
bundle exec jekyll serve
补充说明
- 确保你的 MathJax 配置与 Markdown 内容兼容。你可能需要根据具体需求调整配置。
- 如果遇到问题，请检查浏览器控制台中的错误信息，并相应调整你的 JavaScript 代码。
通过遵循以上步骤，你应该能够成功将 Jekyll 博客从 Kramdown 切换到 Marked，并利用更好的 MathJax 支持来渲染数学公式。