7
16

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Markdown Preview EnhancedでPDF出力する。

Last updated at Posted at 2019-08-22

VS CodeにインストールしたMarkdown Preview Enhancedで、PDF出力する方法のメモです。
Windows環境前提です。

Chromeをインストールする、またはEdgeを指定する

Google Chromeをインストールする場合

Markdown Preview Enhancedをインストールして、[Chrome (Puppeteer)] -> [PDF]を選択しただけだと、このようなエラーになります。

TypeError [ERR_INVALID_ARG_TYPE]: The "file" argument must be of type string. Received type object

エラーを見ても全然意味がわかりませんが、
Documentation

You need to have the Chrome browser installed.

とあるので、Chromeをインストールします。

Edgeを指定する場合

Google Chromeの代わりにChromium版Edgeを使用することができます。

setting.jsonに下記の様に設定します。

"markdown-preview-enhanced.chromePath": "C:\\Program Files (x86)\\Microsoft\\Edge\\Application\\msedge.exe"

font-family を変更する

Chromeをインストールすると、PDFを出力できるようになったはずですが、俗に「中華フォント」と呼ばれるフォントで日本語が表示させてしまいます。

CSSを編集し、フォントを指定します。
~\.mume\style.less にCSSファイルがあるので、印刷用の設定を追加します。

@media print {
.markdown-preview.markdown-preview {
    font-family: "MS PMincho";
}
}

PlantUML用のfont-family を変更する

前述のfont-familyの変更だけでは、Markdown内のPlantUML(svg)は変わりません。
svg textを追加します。

@media print{
.markdown-preview.markdown-preview, svg text {
    font-family: "MS PMincho";
}
}
7
16
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
16

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?