由于 React 19 兼容性问题，Create React App 正式弃用-51CTO.COM

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

而作为替代，目前更推荐大家使用 vite 来创建 React 项目。

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.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"
}