create-react-app 相关问题

create-react-app是一个入门套件,用于创建没有构建配置的React应用程序。如果您开始使用React,请使用此选项来自动构建应用程序。没有配置文件,react-scripts是package.json中唯一的额外构建依赖项。您的环境将拥有构建现代React应用程序所需的一切。

CRA 上带有“@”的绝对导入不起作用

我尝试将应用程序从相对导入迁移到绝对导入。根据 CRA 文档,我将这些代码添加到我的 tsconfig.json 文件中: { “编译器选项”:{ “基本网址:&...

回答 1 投票 0

ComponentWillUnmount 方法永远不会被调用

我正在开发一个简单的反应应用程序,包含以下页面: 导出默认类 App 扩展 Component { ... 使成为(){ 返回 ( 我正在开发一个简单的反应应用程序,包含以下页面: export default class App extends Component { ... render(){ return ( <Router> <Navbar.../> <Switch> ... <Route exact path="/project" render={(props) => ( <Project .../> )} />) } } 我想在每次用户退出项目组件时进行检测,以执行一些逻辑。我尝试使用 componentWillUnmount 方法如下: class Project extends Component { constructor(props) { super(props); this.state = { loading: true, }; } componentWillUnmount(){ console.log("hello, world!") } ... } 问题是,该方法永远不会被调用:当我尝试刷新页面时,更改 url ecc,有任何提示吗? 反应版本:^18.3.1 反应路由器版本:5.2.0 谢谢 重新加载页面基本上意味着“转储当前页面”并重新加载,React应用程序和组件没有机会卸载。您可以利用 beforeunload 侦听器来运行一些逻辑,以防用户重新加载整个页面或页面因任何其他原因卸载(就像它们完全导航出您的应用程序,导航到另一个域/页面等。 ). class Project extends Component { ... // unload event callback handler unloadHandler = () => { console.log("hello, world!"); }; componentDidMount() { // instantiate unload event listener window.addEventListener("beforeunload", this.unloadHandler); } componentWillUnmount() { // remove unload event listener when component just unmounts window.removeEventListener("beforeunload", this.unloadHandler); // manually call handler to run the same logic this.unloadHandler(); } ... }

回答 1 投票 0

mui 5 反应中没有样式标签

我在React.js中构建了2个项目,一个使用material ui 4,另一个使用mui5。这两个网站都运行良好,样式也很完美。我注意到在项目中...

回答 1 投票 0

在 Windows 上创建 React 应用程序时遇到 ENOENT 错误:无法找到目录

我在尝试使用 npx create-react-app 创建新的 React 应用程序时遇到了一个持续存在的问题。在我的项目目录中。尽管遵循了几个故障排除步骤,我仍然继续重新...

回答 1 投票 0

有 npm 已弃用的问题

npm warn deprecated [email protected]:不支持此模块,并且会泄漏内存。不要使用它。如果您想要一种良好且经过测试的方法来通过键值合并异步请求,请查看 lru-cache,w...

回答 1 投票 0

Websocket 连接 - 从 create-react-app 迁移到 Vite 后出现“2000 所有传输失败”。 React、Sockjs 客户端、webstomp 客户端、Spring Boot

我将 React 与 sockjs-client 和 webstomp-client 依赖项结合使用来建立与 WebSocket 的连接。之前,我使用过 Create React App 来启动 React pro...

回答 1 投票 0

来自 OL-EXT 库和 Typescript 的动画集群

我在我的 React Web 应用程序中使用 openlayer。 问题是我正在尝试从“ol-ext/layer/AnimatedCluster”导入 AnimatedCluster,当我尝试使用它进行渲染时,它需要 ol-ext 的类型,即 @t...

回答 1 投票 0

如何使用 Electron 访问生产中的 sqlite3 数据库文件?

我有一个电子应用程序,我将它与 create-electron-app 一起使用。 我的电子主进程文件位于公共文件夹中,我的 sqlite3 数据库也是如此。 当我引用数据库时...

回答 3 投票 0

如何让 vitest 读取我的绝对导入?

我正在从 CRA 迁移到 Vite,但在尝试让测试再次运行时遇到问题。 我的进口看起来像这样: 从“组件/组件A”导入{组件A};

回答 1 投票 0

错误:在现有 CRA 应用程序中使用 Jest 测试 Mantine v6 组件

我在尝试使用 Jest 将测试添加到我现有的 Create React App (CRA) 项目(该项目使用 Mantine v6 组件)时面临挑战。我一直遵循 Mantine 中的测试指南

回答 1 投票 0

本地主机中未捕获的运行时错误:3000

我正在使用地图 JavaScript API(谷歌 API)并在我的 React 应用程序中遇到未捕获的运行时错误。该网站似乎运行良好,因此很难知道这个错误来自哪里

回答 1 投票 0

模块解析失败:意外的标记 (1:68)

大家好。有人可以帮助我吗?我只是创建反应应用程序,然后立即启动它。然后我得到了类似这样的错误。我不知道出了什么问题 编译失败。 ./src/index.js 1:68

回答 1 投票 0

React.js:如何在不同端口上启动反应应用程序

我刚刚开始学习React.js并使用Create React App制作了两个项目。 现在,如果我想同时启动这两个项目,我不能,因为默认情况下两个项目都在端口 3000 上启动。 难道是……

回答 2 投票 0

如何在 Cypress 运行的浏览器中使用 process.env 变量

在我的应用程序的源代码中(基于 create-react-app 的 React),我使用像这样的环境变量: process.env.REACT_APP_API_URL 存储在我的 .env.* 文件中。 但当我运行同样的

回答 7 投票 0

由于缺少“react-scripts”包,无法使用 Yarn 4 在 docker 中运行 React,但在本机上运行良好(无需 docker)

我从头开始创建一个新的ReactTs项目,使用Yarn 4.4.1(刚刚开始使用yarn 4)。 我使用 Create React App Client 创建了该项目: # 在我的 /frontend 目录中 纱线创建反应应用程序。 --

回答 1 投票 0

npx 在 React、Expo 和下一个应用程序初始化期间挂起

我目前遇到一个问题,在尝试初始化项目时,以下命令(以及可能更多)无限期挂起: npx 创建反应应用程序 npx 创建博览会应用程序 npx 创建-...

回答 1 投票 0

更改后重新加载时以最大 z 索引响应注入 iframe(开发)

我有一个带有以下 .env 文件的 Create React 应用程序: 浏览器=无 SKIP_PREFLIGHT_CHECK=true INLINE_RUNTIME_CHUNK=假 当我使用yarn start启动应用程序时,在更改任何代码后,服务器会...

回答 6 投票 0

运行 npx create React app 时套接字超时

如何解决这个错误? 我运行 npx create-react-app my-app 并收到以下错误:ERROR Socket timeout

回答 1 投票 0

如何修复使用useEffect React Hook时缺少依赖项警告

在 React 18.3.1 中,当我尝试阻止获取请求上的无限循环时,出现此错误: src\pages\ItemDetail.js 第 16:8 行:React Hook useEffect 缺少依赖项:“id”。删除

回答 1 投票 0

未找到规则“@typescript-eslint/no-redeclare”的定义

在我的所有 .ts 或 .tsx 文件中,文件中的第一个字符上都有此警告,如下面的屏幕截图所示: 我正在使用标准 CRA 设置。这是我的 package.json: { “姓名”:“...

回答 7 投票 0

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.