React大好きなんですがちょっと離れてると機能が増えてたり、変更があったりと追いつくのがなかなか大変です。
今年はAdvanced Configurationで廃止された設定、新しく追加された設定に絞って書いてみます。
一部、勉強のためにcreate-react-appの修正箇所も紹介します。
Advanced Configurationの公式ドキュメント
設定方法
shellで設定する場合には
"scripts": {
"start": "CI=true react-scripts start",
のようにするか、.envファイルで
CI=true
のように環境ごとに設定します。
廃止されたAdvanced Configuration
NODE_PATH
react-scripts@4.0.0で廃止。
今後はjsconfig.jsonまたはtsconfig.jsonにbaseUrlを設定してねってこと。
もともと、baseUrlを設定してない場合には、NODE_PATHを使うようになってたのでやっとなくなったのかという設定。
EXTEND_ESLINT
これも同じくreact-scripts@4.0.0で廃止。
この設定がなくても拡張できるようになったとのこと。
追加されたAdvanced Configuration
WDS_SOCKET_HOST
WDSはwebpack-dev-serverから。
Hot Module Replacement用にカスタムのwebsocketホスト名で開発サーバーを実行。
webpack-dev-serverのデフォルトはwindow.location.hostnameで、SockJSのホスト名を指定します。
この変数を使用して、一度に複数のプロジェクトでローカル開発を行える。
WDS_SOCKET_PATH
webpack-dev-serverのデフォルトは、SockJSパス名の/sockjs-node。
この変数を使用して、一度に複数のプロジェクトでローカル開発を行える。
WDS_SOCKET_PORT
webpack-dev-server のデフォルトは、SockJS ポートの window.location.port です。
この変数を使用して、一度に複数のプロジェクトでローカル開発を開始を行える。
FAST_REFRESH
Fast Refreshという実験段階の機能。
アプリ全体をリロードするわけではなく、修正したコンポーネントのみを更新することにより高速開発が可能になる。
問題があったらfalseに設定してオフにしましょう。
DISABLE_NEW_JSX_TRANSFORM
React 17 で導入され、React 16.14.0、15.7.0、0.14.10 にバックポートされたNEW JSX TRANSFORMを無効にします。
古いReactプロジェクトでReactをバージョンアップできなく問題になる場合に使用する。
まとめ
どうでしたか？
設定の廃止、追加をみるだけでも今年1年のReactの変化が見れて面白いですね！
今年追加された設定は、自分の開発ではあまり使う機会はないかも。
廃止された設定は使っていたのでそっと削除しておこうと思います。
来年もReactはどのように変化していくのか楽しみですね！