由于 React 19 兼容性問題，Create React App 正式棄用
Hello，大家好，我是 Sunday。
前段時間 React 19 正式發布 帶來了一系列的新功能。這些新功能大家用起來很爽，但是也帶來了一些新的生態問題。其中比較關鍵的就是 create-react-app（簡稱 CRA） 不能用啦...
因為 CRA 默認安裝 React 的最新可用版本，這也就意味著在 React 19 發布后它會安裝 React 19。但是 CRA 的默認模板包括 React Testing Library v13，它需要 React 18，而不是 React 19。
當 npm 檢測到這種不匹配時，它會拋出一個錯誤，導致項目無法正確設置。
針對這個問題，Redux 的作者 Mark Erikson 在最近的 GitHub 問題中詳細說明了這種不兼容的問題（https://github.com/facebook/create-react-app/issues/17004）：
圖片
雖然基于此，Mark Erikson 提供了 臨時解決方案，但是這并不能解決長期的問題：
圖片
因此，我們就得出了一個結論 CRA 已經過時了！
CRA 已經過時了
然后 CRA 已經很多年沒有人進行維護了
圖片
但是，從 npm 的下載統計中，依然可以看出它依然是 React 開發者的常用工具
圖片
同時，在國內的很多教程中，也都是使用 CRA 進行項目構建的。
所以，這樣的問題，就必須要提供對應的 解決方案。
而 React 官方團隊也給出了對應的解決方案，那就是 棄用...
截圖來自 github create-react-app 倉庫 README
截圖來自 github create-react-app 倉庫 README
而作為替代，目前更推薦大家使用 vite 來創建 React 項目。
基于 Vite 的遷移方案
- 卸載 CRA 依賴
npm uninstall react-scripts
npm install vite @vitejs/plugin-react --save-dev- 調整項目結構
將 index.html 移至項目根目錄，并更新腳本引用為 ESM 格式：
<script type="module" src="/src/main.jsx"></script>將 .js 文件擴展名改為 .jsx（如 App.js → App.jsx）。
- 配置 Vite
創建 vite.config.js 文件：
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
export default defineConfig({
plugins: [react()],
});- 更新環境變量
環境變量前綴需從 REACT_APP_ 改為 VITE_（如 VITE_API_KEY=123）。
- 運行與調試
修改 package.json 腳本命令：
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
}
