webstormをローカル連携させる

実のところ、XAMPPさえ入っていれば公式の手順で楽ちん導入できると思います。
(私は気分でWSL2に触り始めてしまった・・・色々躓いているので、忘備録として付けています)

はじまり

ちょっと前に、PHPを毎回サーバーにアップロードして動作チェックとかやっていたのですが、
Ideaでのファイルアップロードって、なんか面倒だし、、、
そもそもサーバーじゃなくてローカルで確認したい。

魔が差した

せっかく年末にWSL2を導入して、SSH接続したのだから、
Ubuntuでローカルサーバーを立てれば良いんじゃない?

と、
思ったのですが、

なんとなくDockerを使いたくて、Dockerコマンドを打ってみるも、なんかエラーが出てしまいました

UbuntuのWSLを2に変換

WSL2自体は2020年1月には使えた?らしいのですが、
うっかりWSL(1)でUbuntuを入れてしまってて。

WSL2方式で入れなおしたつもりだったのですが、
全体的にはWSL2が入っていたけれど、入れなおしたつもりのUbuntuはWSL(1)で入っていたらしく、

The command 'docker’ could not be found in this WSL 2 distro.
We recommend to activate the WSL integration in Docker Desktop settings.

See https://docs.docker.com/docker-for-windows/wsl/ for details.

とか怒られてしまった。

上記URLの手順通り、Windows PowerShellを管理者権限で開いて、WSLの導入済みリストを確認すると、下記のようになっており、

PS C:\Windows\system32> wsl.exe -l -v
NAME STATE VERSION
* docker-desktop-data Running 2
Ubuntu Running 1
docker-desktop Running 2

UbuntuだけWSL1であることが確認できたので、2形式に変えた。
(実際結構時間がかかった 15分くらい・・・?)

PS C:\Windows\system32> wsl.exe --set-version Ubuntu 2
変換中です。この処理には数分かかることがあります...
WSL 2 との主な違いについては、https://aka.ms/wsl2 を参照してください
変換が完了しました。

変更後、DockerImageの方法でNGINXを立ち上げ。

docker run -it --rm -d -p 8080:80 --name web -v /mnt/c/work/web/tailpiece.dev:/usr/share/nginx/html nginx

上記は、Cドライブのwork/web/tailpiece.devの内容が、localhost:8080に表示されるようになる。

その後、c/work/web/tailpiece.devに、仮のindexを作成し、反映されることを確認する。
(docker-composeは一旦後回しにしました)

webstormの設定

上記設定後、自動アップロードONにした状態で1回デプロイすれば、その後は保存後に自動で同期されるようになる

悩み

webstormのローカルサーバー設定って、SSH接続とかは できないので、
WSL2なのに、マウントしているCドライブを参照していて ちょっとイケてない感が・・・(ちょっと遅いらしい)。

あと、WSL2ってCドライブ丸ごとマウントしているので、わざわざCドライブに複製(同期)せんでも、
編集ディレクトリそのものを指定してやれば事が足りそうな気がしています・・・。

ローカルSSHにした

既にWSL2へSSH接続はできるようにしていたので、ローカル環境ではあるんだけれど、SSHとして扱い、アップロード・同期させるようにした。

ルートパスは、めんどかったので自分のHOMEにディレクトリを1階層作成しました
htdocsをrootで作ってしまって、sudo chown tail:tail htdocsで所有者を自分に戻したのはナイショ。

NGINXの起動も、下記に修正しています。

docker run -it --rm -d -p 8080:80 --name web -v ~/htdocs:/usr/share/nginx/html nginx

ああ、これでスッキリ寝られるぞ・・・!