Visual Studio Code + Markdown PDF でPDFのカタカナ文字化け

はじめに

Visual Studio Code で作成した Markdownファイル を久しぶりに PDF 変換したところ、コードブロック内のカタカナが文字化け □□□□ した。

日本語フォントが設定されていないんじゃろなと思い下記修正を行いました。

環境

• Windows 10 Pro x64 1903
• Visual Studio Code 1.42.1
• Markdown PDF 1.4.2

修正

Visual Studio Code のユーザーディレクトリにある CSS ファイルを修正

C:\Users\xxxxxxxx\.vscode\extensions\yzane.markdown-pdf-1.4.2\styles\markdown.css

修正前

body {
    font-family: "Segoe WPC", "Segoe UI", "SFUIText-Light", "HelveticaNeue-Light", sans-serif, "Droid Sans Fallback";
    font-size: 14px;
    padding: 0 12px;
    line-height: 22px;
    word-wrap: break-word;
}

...

code {
    font-family: Menlo, Monaco, Consolas, "Droid Sans Mono", "Courier New", monospace, "Droid Sans Fallback";
    font-size: 14px;
    line-height: 19px;
}

修正後（それぞれの font-family に "Meiryo" を追加）

body {
    font-family: "Meiryo", "Segoe WPC", "Segoe UI", "SFUIText-Light", "HelveticaNeue-Light", sans-serif, "Droid Sans Fallback";
    font-size: 14px;
    padding: 0 12px;
    line-height: 22px;
    word-wrap: break-word;
}

...

code {
    font-family: "Meiryo", Menlo, Monaco, Consolas, "Droid Sans Mono", "Courier New", monospace, "Droid Sans Fallback";
    font-size: 14px;
    line-height: 19px;
}

結果

コードブロック内のカタカナの文字化けは直りましたが、PDF のヘッダーに設定されるファイル名のカタカナは文字化けのままでした。