VSCode:MPEのまとめ

MPEの機能

ブログなのでその時自分が思ったことをつらつら書いていて、いつかまとめようと思うわけです。

ここは名前のとおりガラクタ箱なので、読みにくい物、何をしているのか分からないことも、本人からみると思考過程が わかって良い物なのですが、もう少し詳しくなったらQiitaにでもまとめます。

ところで、MPEのコンテキストメニューを手を動かしながら読み解いていくと、つぎのようになっているかと思います。

僕の頭の中のMPE

パーサー、レンダラーがいいのか、その日本語訳が正しいかはわかりません。(泣)

いずれにしても分かったことは、PDFにする際にはCSSで様式を整えられること、同様の機能を持つVSCodeの拡張機能にもいろいろな違いがあることです。

Markdown-PDFの出力などと比べてみましょう。

出力の比較

puppeteer PDFの設定

上のMPEでコード背景が違う場合、次の設定をします。だいぶ悩んだんですが.... 検索して見つかったのはここです。

github.com

これに該当する設定を探しました。ctrl + ,で以下。

printBackground

それで、フロントマターを次のようにする。

---
title: "Habits"
author: John Doe
date: March 22, 2005
output: pdf_document
print_background: true
---

そうしたら、こうなります。

print_backgroud:trueの出力

MPEとMarkdown-PDFのシンタックスハイライター

MPEは、Prism.js、Markdown-PDFはhighlight.jsの違いがあるようです。

余談

JavaScript、CSSまでは聞いたことがあったのですが、TypeScriptやlesscssというのがあるというのを初めて知りました。(汗；