WindowsでReactの開発環境構築は一癖あった話
タイトル通りです.
具体的にはtsxを上書き保存した際にホットリロードされないのが不便だったのでいろいろ工夫したという話です.
WSLを使った方法で解決しました.
環境
Windowsの環境
WebStorm(IDE) WebStorm 2020.1.1
Build #WS-201.7223.93, built on April 30, 2020
Runtime version: 11.0.6+8-b765.40 amd64
VM: OpenJDK 64-Bit Server VM by JetBrains s.r.o
Windows 10 10.0
1. WSL
WSL上にyarnをインストール
https://ubunlog.com/ja/yarn-instalador-paquetes-javascript-ubuntu-20-04/
ただし, node_modules/.cache/.eslintcache をオープンできないと怒られたので, 一度ファイルを削除して空の.eslintcacheを生成することでパーミッションエラーを回避
無事にホットリロードに成功.
2.Docker
結論: 重たすぎて使い物にならない
ホットリロードしているつもりが2分以上はタイムラグがある
Dockerfileに
docker-compose-build.ymlに
docker-compose-start.ymlに
最初の一回のみdocker-compose-build.ymlを使ってからdocker-compose-start.ymlを立ち上げた.
正常に立ち上がるものの, あらゆるレスポンスが遅いので使用断念.
コメント入力