vscode でmarkdown の数式を上手く表示したままPDFで保存する

VSCode は様々な拡張機能を持つエディタで、私も色々お世話になっているソフトなのですが、markdownを書く時に1つ欠点があって、それは

数式を上手くPDFで保存できない

ことでした。「Markdown PDF」でそのまま右クリック→PDFで保存しても、出来たPDFファイルには数式が表示されず、「Markdown Preview Enhanced」も、右クリックからの選択肢で出てきた「Chrome」からPDFで保存しても数式がないPDFが作成されてしまう。。。

どうにかならないかとWEBを調べていたら、出てきました!!

qiita.com

Markdown PDF」 でtemplate をいじればいいらしい

。。。しかし、どこにあるか分からない。。。

と思ってまたまたWEBを調べていたら、こちらも出てきました!!

qiita.com

これらの情報を総合すると、
- コマンドパレットで > Extensions: Open Extensions Folder を選び、Enterする
- extensionsフォルダ(拡張機能フォルダ)が開く
- yzane.markdown-pdf-x.x.x\templateのフォルダに移動する
- フォルダ内のtemplate.htmlを開き,以下のように書き直す(一つ目の引用元と同じです)

<!DOCTYPE html>
<html>
<head>
<title>{{{title}}}</title>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
{{{style}}}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.css" integrity="sha384-9eLZqc9ds8eNjO3TmqPeYcDj8n+Qfa4nuSiGYa6DjLNcv9BtN69ZIulL9+8CqC9Y" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.js" integrity="sha384-K3vbOmF2BtaVai+Qk37uypf7VrgBubhQreNQe9aGsz9lB63dIFiQVlJbr92dw2Lx" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/contrib/auto-render.min.js" integrity="sha384-kmZOZB5ObwgQnS/DuDg6TScgOiWWBiVt0plIRkZCmE6rDZGrEOQeHM5PcHi+nyqe" crossorigin="anonymous"></script>
<script>
  document.addEventListener("DOMContentLoaded", () => {
    renderMathInElement(document.body, {
      delimiters: [
        { left: "$$", right: "$$", display: true },
        { left: "$", right: "$", display: false },
      ]
    });
  });
</script>
</head>
<body>
{{{content}}}
</body>
</html>

こう書き換えた後は普通に右クリックから「PDFで保存」して出来上がったPDFで数式が表示されるようになりました。

これで更に快適な markdown 生活が送れそうです。