WSL2 + VScode + nodenv(anyenv)の環境構築方法まとめ

## [公式ドキュメント](https://docs.microsoft.com/ja-jp/windows/wsl/install-win10)の通りにWSL2をインストール
- ディストリビューションはUbuntuを選択してください

## VScodeとの連携
- [VScode](https://code.visualstudio.com/)をインストール
- VScodeに拡張機能「[emote Development](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.vscode-remote-extensionpack)」を追加
- WSL側からVScodeを起動するためにUbuntuコンソールを起動
- Ubuntuコンソールが初回起動の場合は下記のコマンドを実行
    
```bash
$ sudo apt update
$ sudo apt upgrade
```

- 下記のコマンドでVScodeをWSL側から起動することで連携が完了する

```bash
$ code .
```

## brewのインストール（任意）
- [公式ドキュメント](https://docs.brew.sh/Homebrew-on-Linux)を参考にインストールすれば良い

```bash
$ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"
$ test -d ~/.linuxbrew && eval $(~/.linuxbrew/bin/brew shellenv)
$ test -d /home/linuxbrew/.linuxbrew && eval $(/home/linuxbrew/.linuxbrew/bin/brew shellenv)
$ test -r ~/.bash_profile && echo "eval \$($(brew --prefix)/bin/brew shellenv)" >>~/.bash_profile
$ echo "eval \$($(brew --prefix)/bin/brew shellenv)" >>~/.profile
```

## [anyenv](https://github.com/anyenv/anyenv)のインストール

```bash
$ git clone https://github.com/anyenv/anyenv ~/.anyenv
$ echo 'export PATH="$HOME/.anyenv/bin:$PATH"' >> ~/.bash_profile
$ echo 'eval "$(anyenv init -)"' >> ~/.bash_profile
$ ~/.anyenv/bin/anyenv init
```

もし下記の警告が出た場合は・・・

```bash
ANYENV_DEFINITION_ROOT(/home/username/.config/anyenv/anyenv-install) doesn't exist. You can initialize it by:
> anyenv install --init
```

下記のコマンドを実行すると警告が直るはず

```bash
anyenv install --init
```

一通りできたらbashを再起動する

## なぜかコンソール画面のコマンドがハイライトされない場合
下記を.bash_profileの先頭につけてあげると直る

```bash
if [ -f ~/.bashrc ] ; then
. ~/.bashrc
fi
```

## nodenvのインストール
下記のコマンドを実行する

```bash
$ anyenv install nodenv
$ exec $SHELL -l
```

## [anyenv-update](https://github.com/znz/anyenv-update)のインストール
すべてのenvをまとめてアップデートしてくれるプラグインを下記のコマンドで導入する

```bash
$ mkdir -p $(anyenv root)/plugins
$ git clone https://github.com/znz/anyenv-update.git $(anyenv root)/plugins/anyenv-update
```

## [nodenv-default-packages](https://github.com/nodenv/nodenv-default-packages)のインストール
npmインストール時にデフォルトでインストールするパッケージを設定できるプラグインを下記のコマンドで導入する

```bash
$ git clone https://github.com/nodenv/nodenv-default-packages.git $(nodenv root)/plugins/nodenv-default-packages
$ touch $(nodenv root)/default-packages
```

上記のコマンドで作成したdefault-packagesを編集するとデフォルトインストールしてくれる

```:「default-packages」の例
typescript
ts-node
typesync
```

## yarnをインストールする
[nodenv-yarn-install](https://github.com/pine/nodenv-yarn-install)を使ってyarnをnodenv環境にインストールします

```
git clone https://github.com/pine/nodenv-yarn-install.git "$(nodenv root)/plugins/nodenv-yarn-install"
```

## nodenvによるNode.jsのインストールの実行
やっとこさnode.jsをインストールします！

```bash
インストール可能なnodeバージョン一覧を表示
$ nodenv install -l

任意のバージョンのnodeをインストールする
$ nodenv install XX.X.X

デフォルトで適用されるnodeバージョンを設定
$ nodenv global XX.X.X

Yarnが使えるか確認
$ yarn -v
X.XX.X

Yarnの実行ファイルの場所を確認
$ which yarn
```

## 最終的な.bash_profileの内容
.bash_profileの内容で結構詰まりました！参考までにどうぞ！

```bash:.bash_profile
if [ -f ~/.bashrc ] ; then
. ~/.bashrc
fi

export PATH="$HOME/.anyenv/bin:$PATH"
eval "$(anyenv init -)"

eval $(/home/linuxbrew/.linuxbrew/bin/brew shellenv)
eval $($(brew --prefix)/bin/brew shellenv)
```