はじめに

LLMの流行りでMarkdown形式の文章を書くことが増えているような気がします。これまではVSCode+拡張機能(Markdown All in One & Markdown Preview Enhanced)の環境を使っていたのですが，別の拡張機能を使えば有料ソフトであるTyporaとほぼ同じことができるようなので，そちらに環境を変えてみようと思いました。

拡張機能のインストール

名前がそのまま「Typora」の拡張機能がVSCodeにあります。

いつも通りVSCodeにインストール。ちなみにこの拡張機能を入れるとWordやExcelも読み込めるようになり，Excelの方は編集も可能です(Wordは読み込めるだけです)。

日本語フォントに変更

この拡張機能は開発が中国なこともあり，日本語を書くとフォントが非常に違和感があります。なので日本語フォントに変えます。

基本的にはこちらのサイトに書いてある通りでフォントを変えられるのですが，別の場所を編集しても変更できたので備忘録として残しておきます。

編集するファイルはC:\Users\*ユーザー名*\.vscode\extensions\cweijan.vscode-typora-X.X.X\resource\vditorにあるindex.cssと，C:\Users\*ユーザー名*\.vscode\extensions\cweijan.vscode-typora-X.X.X\themeにあるgithub-markdown.cssです。
※パスはWindowsの場合です。

どちらのファイルにもfont-familyの記載があるので，その部分を好きなフォントに変更します。私は以下のように設定しました。

index.css

.vditor * {
    font-family: -apple-system, BlinkMacSystemFont, "Noto Sans JP", "Times New Roman", "Yu Gothic", "Hiragino Sans", sans-serif;
}

github-markdown.css

*{
  font-family: "Noto Sans JP", "Times New Roman", "Yu Gothic", "Hiragino Sans",-apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
  font-size: 16px;
}

また，index.cssの方はtext-shadowを設定しているのですが，ここはコメントアウトした方が日本語は読みやすいようです。

/* .win32 * {
    text-shadow: 0 0 0.55px #7c7c7cdd;
} */

設定を変更したのちに拡張機能を再起動すると，日本語フォントに変わっているはずです。

追記

同じようなことをできる別の拡張機能で「vscode all markdown」というものもあります。

こちらも開発は中国なので，同じように日本語フォントに変更すればTyporaのように使えます。
変更するファイルはC:\Users\*ユーザー名*\.vscode\extensions\tobiastao.vscode-md-0.X.X\node_modules\vditor\distにあるindex.cssです。font-familyの指定が(記事執筆時点では)5か所あるはずなので，1,2,5番目を書き換えます。
ただし機能は上で紹介した「Typora」の方が多く，開発も止まっているようなので，こちらを積極的に選ぶ理由はないかもしれません。