react 18 createRoot没有渲染出DOM元素

报错1

TypeError: Cannot read properties of undefined (reading
‘createElement’)

解决办法

//把import React from "react"修改为以下引用方式：
import * as React from "react";
1
2

报错2:

控制台无报错，但是createRoot没有渲染出DOM元素

createReact是把DOM元素渲染到index.html文件中的根元素下面，所以对应的解决办法如下：

检查body里面是否加上了根元素，如：

//...
<body>
	<div id="root"></div>
</body>
1
2
3
4

检查createReact引用的根元素是否正确，如：

const root = createRoot(document.getElementById("root"));
root.render(<h1>Hello world!</h1>);
1
2

此时，Hello，world就会被渲染到id="root"的元素下面；

检查react版本，react17之前的版本渲染方式和react18的不一样：

//react 17
import React from 'react';
import ReactDOM from 'react-dom';
import App from './pages/layout';

ReactDOM.render(<App />, document.getElementById('root'));

// react 18!
import * as React from "react";
import { createRoot } from "react-dom/client";

const root = createRoot(document.getElementById("root"));
root.render(<h1>Hello world!</h1>);
1
2
3
4
5
6
7
8
9
10
11
12
13

摘自react官网

相关阅读:
Telnet连接
Linux学习-18-提取RPM包文件(cpio命令)
vue页面报Expected indentation of 2 spaces but found 4.eslintindent
HTML中的基础标签（适合于新手）
腾讯云短信服务实现 Java 发送手机验证码（SpringBoot+Redis 实现）
jeecg启动微服务并注册到本地nacos
Docker基础知识
码率vs.分辨率，哪一个更重要？
解决 Tomcat 跨域问题 - Tomcat 配置静态文件和 Java Web 服务（Spring MVC Springboot）同时允许跨域
mysql索引详解

原文地址：https://blog.csdn.net/weixin_46353030/article/details/125518123