react 创建项目报错(react19)详细解决办法

ops/2025/2/14 5:44:29/

一、问题描述

使用脚手架创建项目的时候报错如下:

 二、原因及解决办法

打开项目查看 package.json 文件发现,使用的是最新的19版本,所以会出现版本不兼容的问题

所以我们需要换成18版本的

1、删除node_modules文件夹

2、package.json 中替换 react 版本

    "@testing-library/jest-dom": "^5.17.0","@testing-library/react": "^13.4.0","@testing-library/user-event": "^13.5.0","react": "^18.3.1","react-dom": "^18.3.1","react-scripts": "5.0.1","web-vitals": "^2.1.4"
3、运行 npm install 重新安装,或者 pnpm install
4、npm run start 运行项目 --- 此时运行项目还会报错

报错如下:

问题原因:

这里引入时,如果不接后缀,默认是 jsx 或 js ,但是这里使用 typescript 模版,它们都使用了 tsx 或 ts 作后缀,所以识别不了。

解决办法:

直接在对应报错模块中加上后缀名即可

此时运行成功


http://www.ppmy.cn/ops/158226.html

相关文章

java后端开发day14--之前练习的总结和思考

1.感受 这两天学点儿新的就直接上手打代码,真的是累死个人。我唯一的感受就是,课听完了,代码也跟着打完了(是的,跟着打的,没自己打),感觉自己脑袋里乱乱的,对代码的分区…

AI向量数据库之LanceDB快速介绍

LanceDB LanceDB 是一个开源的向量搜索数据库,具备持久化存储功能,极大地简化了嵌入向量的检索、过滤和管理。 LanceDB的主要特点 LanceDB 的主要特点包括: 生产级向量搜索:无需管理服务器。 存储、查询和过滤向量、元数据以…

游戏引擎学习第97天

回顾昨天并计划今天 在这期节目中,主要讲解了光照的概念,并进一步讨论了法线贴图光照的实现。节目的内容大致分为几个部分: 光照的基础概述:讨论了光的工作原理以及如何在编程图形时需要考虑光照问题。尽管这些概念并没有深入到…

SpringBoot分布式应用程序和数据库在物理位置分配上、路由上和数量上的最佳实践是什么?

在设计和部署Spring Boot分布式应用程序时,物理位置分配、路由和数据库数量的最佳实践对系统性能、可用性和可维护性至关重要。以下是相关建议: 1. 物理位置分配 最佳实践: 靠近用户部署:将应用实例部署在靠近用户的数据中心&a…

Go 1.4操作符指针理解

对于初学者来说操作符指针类型、指针、取地址容易混淆,多练就好了。 只需要记住两个符号:&(取内存地址)和*(解引用)。 定义和使用:你可以使用 & 操作符获取一个变量的内存地址&#x…

vscode关闭后如何恢复在远程服务器的终端程序运行界面

网上有很多种解决方案,我觉得比较好用的是screen。这里先介绍screen的安装和使用办法: 通过 conda 安装 screen是比较方便的方式,可以按照以下步骤操作: 通过 Conda 安装 screen 打开终端或命令行工具。确保你已经激活了 Conda 环…

防火墙是什么?详解网络安全的关键守护者

当今信息化时代,企业和个人在享受数字生活带来的便利时,也不可避免地面对各种潜在的风险。防火墙作为网络安全体系中的核心组件,就像一道牢不可破的防线,保护着我们的数据和隐私不受外界威胁的侵害。那么防火墙是什么?…

Vite入门指南

一、什么是Vite? Vite(法语意为"快速")是由Vue作者尤雨溪开发的新型前端构建工具。它基于原生ES模块(ESM)实现,具有以下核心优势: 极速启动:冷启动时间比Webpack快10-10…