vscode导出markdown时出现的代码块分、换行错误、不渲染公式的解决方法

环境配置
如果使用 Markdown Preview Enhanced 插件进行预览,并从预览页面右键导出PDF的话,就有可能遇到代码块换页的问题和换行错误问题。
Published

August 15, 2021

NoteContent note — Outdated environment · 环境过时

VS Code Markdown PDF 的 MathJax 配置引用了旧版 cdn.mathjax.org,该服务早已不适合作为现代配置。

  • 新配置应使用当前插件能力或 MathJax 3 的可用 CDN/本地资源。
  • 插件版本 yzane.markdown-pdf-1.4.1 是旧环境路径,不应照抄。

vscode导出markdown时出现的代码块分、换行错误、不渲染公式的解决方法公式

0.本文一切叙述前提为使用 Markdown PDF 插件导出PDF

1.导出时代码块自动换页与换行错误

如果使用 Markdown Preview Enhanced 插件进行预览,并从预览页面右键导出PDF的话,就有可能遇到代码块换页的问题和换行错误问题。

解决方法为:卸载 Markdown Preview Enhanced ,安装 Markdown All in One 然后在markdown源码页面右键导出PDF。并且,在 Markdown Preview Enhanced 提供的预览中,渲染出的换行和导出后的换行一致。

2.使用上述方法导出的PDF不渲染数学公式

找到如下路径(username为你的username)

C://Users/<username>/.vscode/extensions/yzane.markdown-pdf-1.4.1/template/template.html

在文件末尾添加(注意要写在body里面)

<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script type="text/x-mathjax-config"> MathJax.Hub.Config({ tex2jax: {inlineMath: [['$', '$']]}, messageStyle: "none" });</script>

效果如下:

<!DOCTYPE html>
<html>
<head>
<title>{{{title}}}</title>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
{{{style}}}
{{{mermaid}}}
</head>
<body>
  <script>
    mermaid.initialize({
      startOnLoad: true,
      theme: document.body.classList.contains('vscode-dark') || document.body.classList.contains('vscode-high-contrast')
          ? 'dark'
          : 'default'
    });
  </script>
{{{content}}}
</body>
<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script type="text/x-mathjax-config"> MathJax.Hub.Config({ tex2jax: {inlineMath: [['$', '$']]}, messageStyle: "none" });</script>
</html>