ローカルのUbuntu 16.04 LTS上にPHPの開発（勉強）環境を構築しました。エディターは何にしようか？迷っていたタイミングで、Visual Studio Codeバージョン1.0<https://www.visualstudio.com/ja-jp/products/code-vs.aspx>がリリースされました。Windows/Linux/OS X対応のマルチプラットフォームで今回の環境用エディターに採用決定。PHP、HTMLはIntelliSenseによるコードヒントがあって、とっても便利ですね。
今回は、ネットにも情報が少なく、私がはまったフォント周りについてまとめます。
・「ユーザー設定」
設定は 基本設定>ユーザー設定 で開くsettings.jsonファイルに記述します。
このように真ん中のペインに表示される既存の設定（上書きできません）を参考に、必要な設定をsettings.jsonファイルに書きます。
フォントの制御は "editor.font" で行います。
【事前準備】
フォントの名称はしっかり記述しないと、設定できません。最初に自分のマシンにインストールされているフォントの名称を把握して、検討しましょう。
今回は、下記のようにしてインストールされているフォントリストを取得し、フォントファミリーorフォント名、ウェイト名をコピーして使いました。同じフォントファミリーでも、Bold（太い書体）、Regular（レギュラー）、Light（細め）などのウェイトがあるので、自分が意図したフォントが表示されるよう、しっかり記述しましょう。
~$ fc-list
/home/bellota/.fonts/SourceCodePro-Bold.otf: Source Code Pro:style=Bold
/home/bellota/.fonts/SourceCodePro-Regular.otf: Source Code Pro:style=Regular
【フォントサイズを18にしたい場合】
任意の数字を記入します。保存すると、すぐにエディター上に設定が反映されます。
// フォントサイズ
{
"editor.fontSize": 18,
}
【フォントを変更したい場合：デフォルトフォントのUbuntuファミリーを指定】
フォントの名前を記入します。保存すると、すぐにエディター上に設定が反映されます。
// フォント指定
{
"editor.fontFamily": "Ubuntu"
}
【フォントを変更したい場合：Source Code Proファミリーを指定】
フォントの名前を記入します。保存すると、すぐにエディター上に設定が反映されます。
// フォント指定
{
"editor.fontFamily": "Source Code Pro"
}
【フォントを変更したい場合：ウェイト別のフォントを指定】
フォントのウェイトを含めた名前を記入します。保存すると、すぐにエディター上に設定が反映されます。このフォントにすると、英数字が極端に細くなっているのが分かります。
// フォント指定
{
"editor.fontFamily": "Source Code Pro ExtraLight"
}
【フォントを変更したい場合：日本語表記用に別なフォントを指定】
英数字のフォント指定に加えて、日本語表記用の別なフォントを指定します。今回は TakaoExゴシック を表示させます。英数字フォントと日本語フォントの間をコンマで区切ります。保存すると、すぐにエディター上に設定が反映されます。
// フォント指定
{
"editor.fontFamily": "Source Code Pro, TakaoExゴシック"
}
【フォントを変更したい場合：日本語表記用に別なフォントを指定】
英数字のフォント指定に加えて、日本語表記用の別なフォントを指定します。今回は Takao Pゴシック を表示させます。英数字フォントと日本語フォントの間をコンマで区切ります。保存すると、すぐにエディター上に設定が反映されます。先ほどのTakaoExゴシックと比べると、日本語表字が異なるのが分かりますね。
// フォント指定
{
"editor.fontFamily": "Source Code Pro, Takao Pゴシック"
}
【おまけ：私のお気に入り】
いろいろと表示させてみたところ、私のお気に入りは Source Code Pro MediumとNoto Sans CJK JP Regularの組み合わせになりました。
// フォント指定
{
"editor.fontFamily": "Source Code Pro Medium, Noto Sans CJK JP Regular"
}
参考にしたサイト：
・特集：Visual Code早分かりガイド
<http://www.atmarkit.co.jp/ait/articles/1507/10/news028.html>
・＠IT：使用可能なフォントを調べるには
<http://www.atmarkit.co.jp/flinux/rensai/linuxtips/691chkfonts.html>
・Adobe Soure Code Pro
UIやコーディング環境用に開発されたフォント「Adobe Soure Code Pro」は、GitHubから無償でダウンロードできます。
<https://github.com/adobe-fonts/source-code-pro/releases/tag/2.010R-ro/1.030R-it>
・Google Noto Fonts
GoogleとAdobeの共同開発のフォント。世界の多くの言語がコンピューターで問題なく表示されるよう、多くの言語で同じようなスタイルを保ったフォントが制作され、無償で公開されています。私はNoto Sans CJK JPと、日本語フォントを今回設定しました。たくさんのフォントが公開されているので、ダウンロード前に吟味してからインストールしましょう。よくばると、大変な量のフォントがインストールされてしまうので...
<https://www.google.com/get/noto/>