VSCode Themeとは
VSCodeでコーディングをする上で見た目って結構重要ですよね。
VSCode Extensionsには、そういう方々のために、VSCode全体の色味や、シンタックスハイライトの色合いをテーマという単位で変更してくれる拡張機能が大量に存在します。
言語や他のIDEに似せるためのものや、季節や景色、アニメのキャラクターなど、様々なテーマに沿ったものがあるので、ぜひインストールしてみてほしいです!
こちらのサイトでテーマを一覧で見ることができ、気に入ったものをそのままVSCodeでインストールできるのでお勧めです!
VS Code Themes
ちなみに、複数インストールしたテーマを変更したい場合は、VSCodeの設定で、Workbench: Color Themeと検索すると一番上に出てくる項目のドロップダウンから変更するだけです。
気分転換に変えてみたり、家で作業する時とオフィスで作業する時で変えてみるのもいいかもしれませんね!
イタリック体問題
このVSCode Theme、すごくいい拡張機能なのですが、作成している方が海外の方が多いからなのかわかりませんが、一部言語のシンタックスや、予約語をイタリック体にしたものがあります。
特に、おしゃれ系やかわいい系に多い印象を受けました。(確かにくるんとしてて流体系の文字なので使われている理由もよくわかりますが...)
しかし、我々日本人にはあまり馴染みのない字体だと思います。
これはQiitaというテーマを適用した際のJavaそソースコードですが、型宣言やアノテーションがイタリック体になっているのがわかると思います。
これぐらいならまだましな方ですが、コメントアウトや、変数がイタリック体になっているテーマもあり、プログラミングをする上で、少しネックになってしまいそうだったので、設定ファイルを弄って、イタリック体を通常の字体に変更する方法も書いておきます。
イタリック体→通常の字体への変更方法
そこまで難しいことはしなくて大丈夫です。
まずは、該当するテーマの拡張機能フォルダを開きます。
VSCodeの拡張機能はWindowsであれば、
C:\Users\ユーザー名\.vscode\extensions
に格納されています。(Macは触ったことないので、わからないです...)
このフォルダを開けたら、Ctrl+F
でフォルダ内検索を行い、該当する拡張機能を探しましょう!
設定ファイルを開く
該当のフォルダを開くことができたら、設定ファイルを探します!
設定ファイルは基本的にjsonファイルで書かれているので、それっぽいjsonファイルを探します。
探すといっても、基本的には、themes
というフォルダに入っているようなので、まずはそこを探してみてください。
themesフォルダを見ると、おそらく1つだけでjsonファイルが置かれているはずなので、それを開きましょう。
設定ファイルを変更する
jsonファイルを開くと、何に何色を使って字体はどうするか、というのがたくさん書いてあります。
感がいい人は理解できたと思いますが、この字体はどうするか(fontStyle)がイタリック体(italic)になっているものを変更してあげればいいだけです。
ここでも、Ctrl+F
で検索を開いて、italic
と入力してあげれば、どこでイタリック体が適用されているのかが一目瞭然です。
このitalic
を空にしちゃえばOKです!
"fontStyle": "italic",
↓
"fontStyle": "",
変更をする際に1つだけトラップがあって、このまま置換しちゃいたくなるところですが、実はitalic
というワードはfontStyle
以外にも書かれている場合があるんですよね...(多分元々イタリック体のところをどうするか、というニュアンスでした)
そのため、一括置換はせずに1つずつ置換するか、1度fontStyle
以外にitalic
が適用されていないか確認してから一括置換するなどの方法を取るようにしましょう。
それが終わったら、ファイルを保存して、一度VSCodeを終了しましょう。