解决了从React 18降级到React 17时出现的错误的故事
继续上一篇文章的内容。
我会参考这个视频。
请给我一个选项,将以下内容用中文进行原生重述:
https://www.youtube.com/watch?v=MzJkWO73S70&list=PLX8Rsrpnn3IVOk48awq_nKW0aFP0MGpnn
开发环境
操作系统:Mac
编辑器:VSCode
由于在开发过程中从React 18降级到React 17,导致了各种错误的发生。
发生错误。
Module not found: Error: Can't resolve 'react-dom/client' in '/User/~~/chatbot-demo/src'
据我搜索得知,似乎是由于降级而导致无法找到模块的路径。
因此,我在根目录下尝试了以下命令。
$ npm install react-dom@17.0.2
在完成安装后,如果运行npm start会遇到相同的错误,所以按照先前的文章继续删除
– package-lock.json
– node_modules
然后尝试运行npm install。
似乎删除package-lock.json和node_modules然后重新运行npm install可以解决这个问题,如果你也遇到类似的困扰,可以试一试这个方法。
然而,又一次出错了。
原因和解决方法 hé
听说 React 18 和 React 17 的 index.js 编写方式存在差异,所以需要修改 src/index.js 的编写,使其与 React 17 相匹配。
import React from 'react';
// import ReactDOM from 'react-dom/client'; ←React18では必要
import {render} from 'react-dom'; //←React17ではこちら
import './assets/styles/index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
// const root = ReactDOM.createRoot(document.getElementById('root')); React18で必要
const root = document.getElementById('root'); //←React17ではこちら
render(
<React.StrictMode>
<App />
</React.StrictMode>,
root
);
在React 18中,被注释的部分是必需的写法。在React 17中,必需的写法被写在它的下面。
成功地解决了降级过程中的错误,没有出现任何问题。
我的感觉
在开发过程中改变版本听起来很可怕,因为可能会出现各种依赖关系的问题。但是能够一一面对并解决出现的错误,作为一个初学者工程师,我觉得我在成长的道路上迈出了一小步。