迹忆客 专注技术分享

要更新我们的 React 版本，需要通过运行 npm install react@latest react-dom@latest 安装最新版本的 react 和 react-dom 包。 如果你使用 create-react-app，还要更新 react-scripts 的版本。

在项目的根目录（package.json 文件所在的位置）中打开终端并运行以下命令：

# 👇️ 使用 NPM
$ npm install react@latest react-dom@latest

# 👇️ 仅当使用 TypeScript
$ npm install --save-dev @types/react@latest @types/react-dom@latest

# ------------------------------

# 👇️ 使用 YARN
$ yarn add react@latest react-dom@latest

# 👇️ 仅当使用 TypeScript
$ yarn add @types/react@latest @types/react-dom@latest --dev

该命令将更新 react 相关包的版本。

如果出现错误，请尝试使用 --force 标志运行命令，例如 npm install react@latest --force。

如果你使用 create-react-app，还要更新 react-scripts 包的版本。

# 👇️ 使用 npm
$ npm install react-scripts

# ----------------------------------------------

# 👇️ 使用 yarn
$ yarn add react-scripts

如果出现错误，请使用 --force 标志运行命令或删除 node_modules 和 package-lock.json（不是 package.json）文件并重新运行 npm install。

# 👇️ 删除 node_modules 和 package-lock.json
$ rm -rf node_modules
$ rm -f package-lock.json

# 👇️ 清除 npm 缓存
$ npm cache clean --force

$ npm install

确保 index.js 文件使用新的 createRoot API。

import {StrictMode} from 'react';
import {createRoot} from 'react-dom/client';

import App from './App';

// 👇️ 确保使用 public/index.html 文件中的正确根元素 ID
const rootElement = document.getElementById('root');
const root = createRoot(rootElement);

root.render(
  <StrictMode>
    <App />
  </StrictMode>,
);

createRoot() 方法将根元素作为参数并创建一个 React 根。

我们还可以更新任何与 react 相关的软件包的版本，例如 通过运行命令 npm install some-package@latest --force 来更新 react-testing-library。