React App：找不到模块 'react-dom/client' 或其相应的类型声明

Question

我目前遇到这个错误，我不确定如何修复它。我一直在尝试将一个项目与存储在bit.dev中的组件合并。

import React from 'react';
import { createRoot } from 'react-dom/client'; // Cannot find module 'react-dom/client' or its corresponding type declarations.
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { BrowserRouter } from 'react-router-dom';
import 'bootstrap/dist/css/bootstrap.min.css';
const rootElement = document.getElementById('root');
if (!rootElement) throw new Error('Failed to find the root element');
const root = createRoot(rootElement);
root.render(
<React.StrictMode>
<BrowserRouter>
<App />
</BrowserRouter>
</React.StrictMode>
);

下面是代码。谢谢你的帮助!

Answer 1

对于任何可能遇到同样问题的人来说，react bit.dev使用的版本和实际应用使用的版本是不同的。我所要做的就是改变应用程序的渲染方式(在本例中是react v17)。

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { BrowserRouter } from 'react-router-dom';
import 'bootstrap/dist/css/bootstrap.min.css';
ReactDOM.render(
<React.StrictMode>
<BrowserRouter>
<App />
</BrowserRouter>
</React.StrictMode>,
document.getElementById('root')
);

Answer 2

按照这里的指示运行npm install react react-dom或yarn add react react-dom后，您应该运行

npm install -D @types/react-dom

或

yarn add -D @types/react-dom

这将添加react-dom/client类型声明到您的项目中，并将删除您在代码第2行指出的错误。

Answer 3

Try

import * as ReactDOM from 'react-dom/client';

则ReactDOM.createRoot