JuliaMono (フォント) を導入する方法

# 本日は

アドベントカレンダーネタとして投稿します.
JuliaMono というフォントを導入する方法を紹介します．

https://juliamono.netlify.app/

> JuliaMono is a monospaced typeface designed for use in text editing environments that require a wide range of specialist and technical Unicode characters. 

等幅（monospaced font）フォントです． このフォントを使うと $\hat{\alpha}$ などの特定の文字に対応する変数を表現するときに読みやすくなります. 例えばブラウザを開いてJupyterNotebook を閲覧する際に見た目が良くなります．

等幅フォントとして `Osaka` を選んだ場合

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/20006d2c-760f-6f0e-61d1-00f7ce65800a.png)

`JuliaMono` を選んだ場合

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/3d7bdc62-d210-ecf3-90c6-ff42dcfa82fe.png)


また適切な設定によって合字（リガチャ， Ligature） にも対応することができます.

例えば無名関数， パイプライン演算子, Pair (Dictのキーとバリューの組みを作るときに使う)を表現するための記号は下記のスクショのような見た目になります:

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/ba132967-a61a-d339-f083-806cba8f244a.png)

合字を使うのがいいかは個々の好みによります． パイプライン演算子が右三角のようにまとまるのは個人的に好きです． 上記のスクショは iTerm2 での例です．

WSL2 上でもフォントの設定をすることで同様の見た目を提供してくれます．

# 導入してみよう

ここでは Mac の場合で説明します. その他のOSの場合は

https://juliamono.netlify.app/download/#installation

を参考にしてください. JuliaMono をダウンロードした後はフォントの設定をどうするかという話に帰着されます．適宜フォントの導入方法をググると色々知見が得られます．

JuliaMono はリポジトリのリリースページから入手できます.

https://github.com/cormullion/juliamono/releases

`JuliaMono.zip` をダウンロードし解凍します．

Font Book を(スポットライトで開いて) 解凍したディレクトリをドラックしてコピーすることでインストールが完了します．

# [iTerm2](https://iterm2.com/) で設定

みんな大好き iTerm2 での設定方法について:

Preferences -> Profiles -> Text の順に進み（設定画面の右下にある）Font
を JuliaMono にします. `Use ligatures` にチェックを入れると合字が有効になります.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/fc153a9e-2fb9-e027-5f3d-d7d23f2c4d40.png)

# Jupyter Notebook での適用

ここではブラウザのフォント設定を変更することで実現する方法について説明します.

`Cmd + ,` で設定画面を開き設定の検索窓で`フォント` を入力(英語版だと `font` でOK)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/18d01385-b799-06c1-7868-594ac316d343.png)

そうすると`フォントをカスタマイズ` というところが出るので
そこをクリックします.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/6892e862-8281-32a9-b5ab-f9efda8f7898.png)

その後画面下側に出てくる`固定幅フォント` を `JuliaMono` に変更します. これで Jupyter Notebook を Google Chrome で開いたときに綺麗なフォントでコードが表示されるようになります.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/476b8279-2238-6703-8de7-ba1fbb951498.png)

CSS による方法もあるようです:

https://qiita.com/kmotohas/items/279d790c137d02999fe7

# VSCode での設定

VSCode で JuliaMono を導入してみましょう. `Cmd + shift + p` でコマンドパレットを開いて Preferences: Open Settings (JSON) を選びます.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/f37e7132-3e7b-0f3d-f5a5-9c7e95201a0b.png)

そうすると `settings.json` というファイルが開きますので，下記の項目を挿入すると反映されます.

```JSON:settings.json
{
　　 // 色々設定がある
    "editor.fontFamily": "JuliaMono, Menlo, Monaco, 'Courier New', monospace",
    "editor.fontLigatures": true,
    // 色々設定がある
}
```

必要に応じて下記記事も参考に：

https://qiita.com/gehnmai/items/1b6593660e1e3ee9bcae

リガチャ不要で単に JuliaMono を使いたければ UI による設定で JuliaMono を追加すればOKです.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/d5716cd6-8a15-ea95-c677-9a20ee54b041.png)

# 追記: JupyterLab

JupyterLab の場合は JupyterLab を起動したときに出てくるホーム画面で上にある Settings を選択し
下記の図の `Advanced Settings Editor` を選びます.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/d9be2922-a230-6730-4d4b-bb34f4f6298c.png)

その後 `Notebook` に向かい次のJSONを追加します:

```json
{
    "codeCellConfig": {
        "fontFamily": "JuliaMono"
    }
}
```

下記の図の `User Preferences` に記入します.

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/135978/6f1211aa-b03f-9f91-db0b-86a5cae33af4.png)

これで整うはずです.

# まとめ

皆さんがよく使うであろうツールに JuliaMono を導入する方法を紹介しました．
数式と対応するために Unicodeをふんだんに使うユーザーであれば JuliaMono の導入は良い選択肢になると思います．