当前位置: 首页 > 工具软件 > hello-react > 使用案例 >

解决 create-react-app 创建react项目时异常缓慢的问题

伍溪叠
2023-12-01

 

第一次通过create-react-app 或者 通过webstorm等编译器创建创建react项目时,因为要安装很多相关的包,而这些包的安装基本都是在内部通过npm进行安装。 由于npm在访问有些国外的资源会非常卡,有的时候即使开了VPN也一样很卡,因此这个时候创建过程可能会异常缓慢,这里其实我们可以使用国内的数据源。经过一番尝试,我找到了一位大神的博客(https://www.uedbox.com/post/8151/)可以解决上述问题,通过他提供的方案二即使用smart-npm,不仅可以实现在使用 npm install 自动从国内的镜像下载,而在我们使用 npm publish 又能发布到官方的 registry 上。具体如下:

 

方案二:使用smart-npm

智能的 npm,让你在中国使用 npm 时,下载速度更快,使用更方便!

背景

用 npm 时,默认它会访问国外资源,所以会非常卡,有时甚至会被禁。现在市面上一般有三种解决方案:

  1. 在 .npmrc 上配置一个国内的 registry 镜像
  2. 使用 cnpm
  3. 使用代理(v_p_n)
  • 第1个方案很粗暴,可以解决很多下载慢的问题,但是当你用 npm publish 时就会失败
  • 第2个方案不错,但这样你就又会遇到问题,到底哪些命令需要用 cnpm,哪些命令需要用 npm 呢?
  • 代理 方案有时也不能百分百解决问题,有时有些代理也不稳定,但有个 代理 很保险就是

其实 cnpm 的意图并不是简单给我们用来去下载 npm 资源的,它是为 cnpm 服务端(也可以理解成 npm 的私有仓库)服务的。

所以,我们就需要一个更智能的 npm 了,可以在我们使用 npm install 时自动从国内的镜像下载,而在我们使用 npm publish 又能发布到官方的 registry 上!

就让 smart-npm 来为你完成吧!

安装

npm install --global smart-npm --registry=https://registry.npm.taobao.org/

如果 window 用户安装最新版本不成功的话,可以试试安装 smart-npm@1 , 两者功能差不多是一样的, 发布版本 2 的主要原因是由于 npm 的升级,使的在 mac 上无法通过 bin 别名的方式覆盖原来的 npm, 只能通过先删除原来的 npm link 文件,再创建一个新的;但这种方式在 window 上可能会有问题, 所以,如果你是 window 用户,并且通过上面脚本无法安装成功的话,可以用下面脚本再试试。

npm install --global smart-npm@1 --registry=https://registry.npm.taobao.org/

安装成功后默认会在你的 npm 用户配置文件 ~/.npmrc 中添加淘宝的 registry。

卸载

npm uninstall smart    # 2.x.x 版本的 smart-npm 在卸载前需要先执行此脚本
npm uninstall --global smart-npm

要先执行 npm uninstall smart 是因为如果直接执行 npm uninstall 会导致找不到 npm 文件。

参考:

npm install慢/无响应解决方案

 

 类似资料: