解决createRoot is not a function

这篇具有很好参考价值的文章主要介绍了解决createRoot is not a function。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

报错:解决createRoot is not a function,报错整理及解决方案,javascript,开发语言,ecmascript

出现的原因:在于把react18使用的vite构建,在开发中因react版本太高与其他库不兼容,而在降级的时候,出现以上dom渲染出现报错。

解决:将 src/index.j文件改成如下

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
)
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

注意在降级修改package.json时候需要注意react、react-dom的版本一致;然后重新 npm install 即可。以下给出package.json文件:

{
  "name": "hello-react",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.17.0",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "react": "^16.14.0",
    "react-dom": "^16.14.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

 文章来源地址https://www.toymoban.com/news/detail-643532.html

到了这里,关于解决createRoot is not a function的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • goland报错:“package command-line-arguments is not a main package”解决方案

    大家好!我是躺平哥。         今天模拟客户端和服务端交互时遇到了一个问题: “package command-line-arguments is not a main package”          翻译过来就是包命令行参数不是主包         因为在Go语言中,和java的main是有所区别的,具体区别如下:         在java中,任何

    2023年04月19日
    浏览(33)
  • layer is not a constructor缺少报错解决方案参考开发教程并在相关页面引入

    问题场景: 1.在使用Mars3d热力图功能时,提示mars3d.layer.HeatLayer is not a constructor 问题原因: 1.mars3d的热力图插件mars3d-heatmap没有安装引用。 解决方案: 1.参考开发教程,找到相关的插件库:Mars3D 三维可视化平台 | 火星科技 | 地图开发 插件库有以下不同类型: mars3d-space     

    2024年02月09日
    浏览(44)
  • uniapp项目启动报错 binding.node is not a valid Win32 application 终极解决方案

    出现问题的前提条件: 阅读 uniapp 官网的教程,快速上手阶段使用 hbuildx 进行项目搭建时,无法成功启动 uniapp 项目。 这个问题在网上有很多解答,但是大部分都说的很不清楚。 在网上随便找了点代码复现错误: 仔细观察可以发现 其实两次出现的这个路径都是同一个,我们

    2024年02月09日
    浏览(74)
  • 【小程序】 解决 Function(...) is not a function问题

    在小程序中,只要写了aync await(或者是你引入的库中写了),如果你使用了babel编译且babel的版本大于7,则会出现这个问题。 小程序中会禁用一些动态写法,在babel/runtime中引入的index.js中写了这么一段: 这里会走到 Function(\\\"r\\\", \\\"regeneratorRuntime = r\\\")(runtime); 中,小程序不支持该

    2024年02月11日
    浏览(38)
  • 关于Could not build wheels for opencv-python-headless, which is...报错的解决方案

    在通过最新版pip在线安装package:opencv-python-headless的时候,会产生报错信息,主要为  ERROR: Failed building wheel for opencv-python-headless ERROR: Could not build wheels for opencv-python-headless, which is required to install pyproject.toml-based projects  如图:  解决方案一:在线加载( 简单快捷,成功率较低

    2024年02月08日
    浏览(55)
  • wx.getUserProfile is not a function微信小程序报错

    在使用小程序wx.getUserProfile接口调用时报错:wx.getUserProfile is not a function  解决办法: 在微信开发者工具上打开详情,对调试基础库进行升级  OK了!

    2024年02月07日
    浏览(36)
  • uniapp 使用mqtt 报错 socketTask onOpen is not a function

    在man.js文件添加这个 为啥不用最新版本4.0,主要是最新版有问题,根据用不起。

    2024年02月10日
    浏览(54)
  • React报错修复:“Uncaught TypeError: destroy is not a function”

    报错: Uncaught TypeError: destroy is not a function at commitHookEffectListUnmount 如果你在useEffect函数中使用了async,运行后会出现该报错。 原理解析:     要知道,useEffect 钩子函数的一个特性是清理功能,即return函数。如果你从 useEffect 钩子函数返回任何东西,它必须是一个清理函数

    2024年02月19日
    浏览(67)
  • Spring Mvc上传文件报错MissingServletRequestPartException:Required request part ‘file‘ is not present两种解决方案

    今天写了个SpringMvc上传文件的接口 运行后报错  附上接口代码  附上 请求截图   出现这种情况通常有两种情况: @RequestPart(\\\"file\\\") 里面的file和前端请求的name=\\\"file\\\"的值 不同 (见上图) 没有配置Spring MVC的文件上传解析器 很明显 这里第一种情况不满足  解决第二种情况的方法有

    2024年01月16日
    浏览(52)
  • 新安webpack插件后编译报错compiler.plugin is not a function

            安装使用generate-asset-webpack-plugin时报错 TypeError:compiler.plugin is not a function ,网上搜索了一下大概就是webpack5与这些插件不匹配。推荐的方法几乎都是换一个适配的插件版本,但我所需要的这个插件在npm上最近更新时间是7年前💔。等不着作者适配于是决定自己改。

    2023年04月24日
    浏览(41)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包