(亲测好用)构建React-app应用时create-react-app卡住超慢的解决办法

简介: (亲测好用)构建React-app应用时create-react-app卡住超慢的解决办法



一、问题:

    在构建react-app的时候,一直卡在加载资源包的地方,重试了几次也是卡住在这里,在git bash时候是看不见卡住在哪里的,因为git bash没有显示加载的过程。可以在项目文件夹按住shift点击右键就会看见:在此处打开PowerShell窗口,打开后输入命令creat-react-app my-app,因为我之前有安装过脚手架工具-cnpm install -g create-react-app,所以我直接调用creat命令,在shell窗口可以看见卡住的过程,语句如以下所示。

fetchMetadata: sill mapToRegistry uri http://registry.npmjs.org/whatwg-fetch

二、解决办法:

    解决方案是换源,这个解决方法是从网上找到的,特此整理过来收藏一下。虽然平常使用cnpm来代替npm,但也只是使用新的指令而已。而在寻求create-react-app的相关配置希望修改registry时失败了,最后发现create-react-app指令默认调用npm,于是直接把npm的register给永久设置过来就好了,这样使用cnpm或者npm就没差别。

输入以下命令

npm config set registry https://registry.npm.taobao.org
-- 配置后可通过下面方式来验证是否成功
npm config get registry
-- 显示出上述地址的话就是更换成功

三、再次尝试

替换过后再次输入构建命令,建议在shell下进行,可以看到过程没有卡住,进度条在动,我觉得看到动着就比较安心。在git bash下只是不知道是否好使的等待。

create-react-app todolist(app名称)

看到向前的进度条就看到了希望,不是卡住就好。当当当当,一会就构建成功啦!

 

目录
相关文章
|
小程序 安全 JavaScript
构建即时通讯APP内的小程序生态体系:从架构设计到技术实现-优雅草卓伊凡
构建即时通讯APP内的小程序生态体系:从架构设计到技术实现-优雅草卓伊凡
1044 1
构建即时通讯APP内的小程序生态体系:从架构设计到技术实现-优雅草卓伊凡
|
Java Shell Maven
【Azure Container App】构建Java应用镜像时候遇无法编译错误:ERROR [build 10/10] RUN ./mvnw.cmd dependency:go-offline -B -Dproduction package
在部署Java应用到Azure Container App时,构建镜像过程中出现错误:“./mvnw.cmd: No such file or directory”。尽管项目根目录包含mvnw和mvnw.cmd文件,但依然报错。问题出现在Dockerfile构建阶段执行`./mvnw dependency:go-offline`命令时,系统提示找不到可执行文件。经过排查,确认是mvnw文件内容异常所致。最终通过重新生成mvnw文件解决该问题,镜像成功构建。
683 1
|
机器学习/深度学习 人工智能 自然语言处理
DeepSeek Artifacts:在线实时预览的前端 AI 编程工具,基于DeepSeek V3快速生成React App
DeepSeek Artifacts是Hugging Face推出的免费AI编程工具,基于DeepSeek V3,支持快速生成React和Tailwind CSS代码,适合快速原型开发和前端组件构建。
2978 39
DeepSeek Artifacts:在线实时预览的前端 AI 编程工具,基于DeepSeek V3快速生成React App
|
前端开发 JavaScript NoSQL
使用 Node.js、Express 和 React 构建强大的 API
本文详细介绍如何使用 Node.js、Express 和 React 构建强大且动态的 API。从开发环境搭建到集成 React 前端,再到利用 APIPost 高效测试 API,适合各水平开发者。内容涵盖 Node.js 运行时、Express 框架与 React 库的基础知识及协同工作方式,还涉及数据库连接和前后端数据交互。通过实际代码示例,助你快速上手并优化应用性能。
|
人工智能 自然语言处理 前端开发
从0到上线,CodeBuddy 如何帮我快速构建旅游 App?
本文详细介绍了AI代码助手CodeBuddy的功能与使用方法,并通过实战演示其在前端开发中的应用。文章首先讲解了CodeBuddy的安装步骤,以VS Code为例,引导用户快速上手。随后,通过构建一个旅游APP页面的实例,展示了CodeBuddy在生成代码、调整样式、修复问题等方面的能力。实战中涉及Craft模式交互、提示词优化、元素布局调整等内容,验证了插件的高效性与灵活性。尽管过程中遇到一些小问题,但整体效果令人满意。最后,文章鼓励开发者进一步探索CodeBuddy的潜力,为开发工作带来更多便利。
1995 0
|
前端开发
create-react-app 如何使用 less/sass 和 react-css-modules?
本文详细介绍了在 create-react-app 项目中如何使用 less/sass 和 react-css-modules 来管理和应用样式。首先,通过安装相应依赖并配置 webpack 支持 less/sass;接着,介绍如何使用这些预处理器编写样式;最后,讲解了如何配置和使用 react-css-modules 实现样式的模块化管理,以及如何结合使用 less/sass 和 react-css-modules 提高开发效率和代码质量。
486 3
|
前端开发 JavaScript 开发者
使用React和Redux构建高效的前端应用
使用React和Redux构建高效的前端应用
353 2
|
前端开发 JavaScript Android开发
掌握React Native,构建跨平台移动应用的利器
掌握React Native,构建跨平台移动应用的利器

热门文章

最新文章