reactの環境構築が変わってきたので変更部分について確認する

はじめに

2年ほど前までreactでフロントエンドの開発を行っていた時はCRAでプロジェクトを構築する形でやっていたが、公式サイトを見たら色々と変わっていたので最近の変化について確認しようと思いました。
しばらく開発から離れると何もわからなくなってしまうので一から勉強です。

CRAが非推奨になる

まずプロジェクトの作成時に使用していたCRAが非推奨になっていたので、背景とそれに代わるものについてです。

非推奨の背景

CRAって何ぞやという点について、reactでプロジェクトを開始するときに必要なツールを1つのパッケージにすることで、一連のツールをインストールする必要がなくなるようにしていたところが役割となっていました。
そんな便利なCRAが非推奨になりそうということで、理由を調べてみました。
CRAの更新が停滞しているとのことでようです。

UX上の問題

reactは空のhtmlファイルとscriptファイルが最終的に生成されますが、ブラウザで表示するときは
1.空のhtmlファイルのダウントード
2.1の完了後、scriptファイルのダウンロード
3.axios等の通信処理でデータ取得して画面に表示
となるため画面表示するまでの時間がかかってしまうこと。

ライブラリの依存関係

ライブラリのサポートがされていなかったり、インストール時のライブラリの依存関係に警告が出てしまっている。ビルドに時間がかかってしまう。

色々な理由から今となっては非推奨になったようでした。

これからのツール

移行先としてViteというツールが今は一般的に使用されているようでした。
https://vitejs.dev/

Viteって何？(ヴィット)

Vue.jsの作者の方が中心となって開発がされているビルドツールになります。
特徴
・開発時はバンドルが不要のため開発サーバーの起動が早い（Native ES Modulesというものを使用している）
・プラグインシステムが優秀
・CRAに比べビルドのスピードが速い

いったんここまで