Win10のWSLでHyperでBashする手順

# やりたいこと

* ターミナルをかっこよくしたい
* Win10でbashを使いたい
* LinuxのVMが欲しい

[WSL](https://docs.microsoft.com/ja-jp/windows/wsl/about) と[Hyper](https://hyper.is/)を使えばこれが解決しそう。

# 手順

## Hyperをインストールする

<https://hyper.is/#installation>
からwindows用のインストーラをダウンロードして普通にインストールします。

インストールが終わると、シェルはcmdで起動します。まだかっこよくはないですが。
![2019-12-02_22h44_28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/488658/ff1f61a5-229e-173f-5fb0-52a50042c07b.png)

### Hyperのキホン

hyperの設定などは基本的にファイル記述で行います。
HPには`$Env:AppData/Hyper/.hyper.js`とありましたが、実際には
`\ユーザディレクトリ\AddData\Roaming\Hyper\.hyper.js`
でした。
プラグインの追加もここに書くだけ、ショートカットキーもここに書くだけ、楽ちんです。

冒頭のgifのようにするには下で書きますが、大抵のことは親切なHPに書いてあります。
<https://hyper.is/>

PowerShellやcmdをHyperで使うだけなら、ここまででカスタマイズだけすればいいでしょう。

## WSLのUbuntuを作る

Hyperをインストールしたら次はWSLでbashを準備します。
情報の多いUbuntuをWSLで立てます。

### WSLを有効にする

`Windowsの機能の有効化または無効化`で`Windows Subsystem for Linux`を有効にします。
![2019-12-02_23h07_54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/488658/f93f4c2e-ec2c-e491-cc34-d2ad3c8ffa17.png)

チェックを入れてOKを押し、再起動したら有効になります。
cmdなどで`wsl --help`とでも入力するとコマンドが確認できます。

### Ubuntuをインストール

次にディストリをインストールします。Microsoft Storeからインストールします。
今回は特にこだわりがないので`ubuntu 18.04 LTS`とします。
![2019-12-02_23h14_50.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/488658/375131a1-51e7-36f2-a3e5-250e6f80f901.png)

サイズが大きいので少し待ちますがVMを立てるよりはよっぽど早いです。
完了したら起動して、`username`、`password`を入力します。これでWSLのセットアップは完了です。

とりあえずおまじないはしておきます。

```bash:wslのubuntu
sudo apt update
sudo apt upgrade -y
```

一度exitして、PowerShellから`wsl --list`コマンドを打つと、存在が確認できます。
このubuntu自体をwslで起動するには作られるショートカットを叩くか、以下のようなコマンドを打ちます。

```PowerShell:PowerShell
wsl --list
> Windows Subsystem for Linux ディストリビューション:
> Ubuntu-18.04 (既定)
wsl -u [user name] -d Ubuntu-18.04
# もしくは 既定 なので以下でも
wsl -u [user name]
```

### Ubuntu（WSL）のホームディレクトリを分かりやすいところにする

上記までのUbuntuのホームディレクトリはシンプルに見えてその実、隠されています。

```bash:wslのubuntu
cd ~
pwd
> /home/[user name]
# 実際は `C:\Users\[windowsのuser name]\AppData\Local\Packages\CanonicalGroupLimited.Ubuntu18.04onWindows_79rhkp1fndgsc\LocalState\rootfs\home\[user name]\`
```

このままでは使い勝手が悪いので、ユーザホームディレクトリを移します。これはUbuntuの知識です。

#### Windowsサイドでディレクトリを作る

好きなディレクトリを作ります。今回は`C:\linux_home`としました。

#### Ubuntuから見えるか確認する

Ubuntu（WSL）のコンソールから以下のコマンドで、アクセスできることを確認します。

```bash:wslのubuntu
ls /mnt/c/linux_home/
```

#### .bashrcなど既にあるファイル群を先に移す

ホームディレクトリを移したら、既に作られたファイルは移動されないので、先にやっておく。

```bash:wslのubuntu
cd ~
cp -r . /mnt/c/linux_home
```

#### `/etc/passwd`を編集してユーザのホームディレクトリを変更

```bash:wslのubuntu
# 設定ファイルを編集します
sudo nano /etc/passwd
# ↓ユーザ名の行を探し/home/xxxを「/mnt/c/linux_home」に変更
{ubuntu上のユーザ名}:x:1000:1000:,,,:/mnt/c/linux_home:/bin/bash
# 保存してnanoを終了
exit
```

#### 確認

一度WSLをexitして再起動したら、以下のコマンドで空ファイルを作って確かめて見ます。

```bash:wslのubuntu
cd ~
pwd
> /mnt/c/linux_home 
touch test.txt
```

WIndowsから`C:\linux_home`にアクセスして、ファイルが見れることを確認します。
SCPなどしなくてもファイルが取れるのは楽ですね。

## Ubuntu（WSL）のbashをHyper（Windows）で動かす

上記までは、PowerShellからWSLコマンドを実行したり、WSLコンソールを使ったりしていたわけですが、HyperのシェルをUbuntu（WSL）のbashにします。

`\ユーザディレクトリ\AddData\Roaming\Hyper\.hyper.js`を編集します。
これは、Hyperのメニュー → Edit → Preference でも開けます。

```javascript:.hyper.js
module.exports = {
  config: {
    //  ～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～
    shell: 'c:\\Windows\\System32\\wsl.exe',
    //  ～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～
    shellArgs: ['~'],
    //  ～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～
};
```

上記のように編集したらHyperを再起動。
するとbash(ubuntu)(WSL)がHyperで動いているはずです。さっきの`test.txt`でも消してしまいます。

## bashのカスタマイズ

上記までで、とりあえずbashは使えましたが、カスタマイズします。zshっぽいbashにします。
ホームディレクトリの`.bashrc`を編集します。
[.bashrcなど既にあるファイル群を先に移す](# .bashrcなど既にあるファイル群を先に移す) の項でコピーしていなければ、デフォルトで生成します。
編集して保存したら、`source .bashrc`で再読み込みします。

### ローカライゼーション

日本語の文字化けが起きないように

```dat:.bashrc
# 末尾に以下を追加
export LANG=ja_JP.UTF-8
```

### プロンプト

プロンプトは、ホスト名を表示しないことにします。
既存の設定を参考に`@`と`\h`、`\h以降の色指定`を消してしまいます。

```dat:.bashrc
# 以下のPS1の代入式だけ変更
if [ "$color_prompt" = yes ]; then
    PS1='${debian_chroot:+($debian_chroot)}\[\033[01;32m\]\u:\[\033[01;34m\]\w\[\033[00m\]\$ '
else
    PS1='${debian_chroot:+($debian_chroot)}\u:\w\$ '
fi
```

`source`コマンドで再読み込みしたら、プロンプトは `ユーザ名:カレントディレクトリ$ `と成っているはずです。

### glob (**)を有効にする。

recursiveオプションの省略的なglobstarを有効にします。

```dat:.bashrc
# 末尾に以下を追加
shopt -s globstar
```

### autocd

コマンドを入れずにディレクトリを指定するとcdとなります。

```dat:.bashrc
# 末尾に以下を追加
shopt -s autocd
```

## Hyperのカスタマイズ

### プラグインの追加

`.hyper.js`に記述してもいいですが、`hyper i`コマンドでもインストールできます。
PowerShellなどから以下をいっぺんに。
プラグイン個別の細かい解説などはしません。

> ※[hypercrowd](https://github.com/hharnisc/hypercwd)はWSLで、尚且マウントしたディレクトリがカレントの場合は問題が起こるようです。
（https://github.com/hharnisc/hypercwd/issues/51）
良いプラグインですが見送ります。

```bash
hyper i hyper-material-theme
hyper i hyper-search
hyper i hyper-transparent
hyper i hyper-highlight-active-pane
hyper i hyper-blink
hyper i hyperline
hyper i hyper-statusline
```

'.hyper.js'を編集するなら

```JavaScript:.hyper.js
// ～～～～～～
  plugins: [
      'hyper-material-theme',
      'hyper-search',
      'hyper-transparent',
      'hyper-highlight-active-pane',
      'hyper-blink',
      'hyperline',
      'hyper-statusline'
  ],
// ～～～～～～
```

### プラグイン各々の設定と確認

とりあえずデフォルトでいく。