首页 > 其他分享 >react 19.0.0 仓库安装

react 19.0.0 仓库安装

时间:2024-05-25 17:03:42浏览次数:32  
标签:node gifsicle 19.0 仓库 安装 yarn react autoreconf com

react19.0.0 仓库安装

克隆仓库到本地:
git clone https://github.com/facebook/react.git

在项目下有个 .nvmrc 文件,指定了 node 版本为 18.20.0

安装 node 18.20.0
nvm install 18.20.0

安装完成后切换 node 版本 nvm use ,该命令会根据 .nvmrc 的配置切换到 node 18.20.0

package.json 中指定了包管理器是 [email protected]

安装 [email protected]
npm i [email protected] --global

yarn 安装完成后,设置国内镜像源
yarn config set registry https://registry.npmmirror.com

准备工作完成,开始安装依赖
yarn install

安装后会报错:

error /Users/pmx/Sites/Commonfiles/Github/react/node_modules/gifsicle: Command failed.
Exit code: 1
Command: node lib/install.js
Arguments:
Directory: /Users/pmx/Sites/Commonfiles/Github/react/node_modules/gifsicle
Output:
⚠ connect ECONNREFUSED 0.0.0.0:443
⚠ gifsicle pre-build test failed
ℹ compiling from source
✖ Error: Command failed: /bin/sh -c autoreconf -ivf
autoreconf: export WARNINGS=
autoreconf: Entering directory '.'
autoreconf: configure.ac: not using Gettext
autoreconf: running: aclocal --force
Can't exec "aclocal": No such file or directory at /opt/homebrew/Cellar/autoconf/2.72/share/autoconf/Autom4te/FileUtils.pm line 299.
autoreconf: error: aclocal failed with exit status: 2

这个错误是安装完成后报的,因为 package.json 中配置了 postinstall 指令,安装完成后会执行该指令。
报错是 gifsicle 中抛出的,查看 gifsicle 代码

gifsicle/lib/install.js

try {
  await bin.run(['--version']);
} catch (error) {
  log.warn('gifsicle pre-build test failed');
}

继续查看 gifsicle/lib/index.js

const url = `https://raw.githubusercontent.com/imagemin/gifsicle-bin/v${pkg.version}/vendor/`;

定位到问题,因为 raw.githubusercontent.com 在国内是被墙了的,所以我的处理方式是配置本地 DNS

首先查看 raw.githubusercontent.com 可解析的 IP 地址

工具:https://ping.chinaz.com/https://raw.githubusercontent.com
选择 ping 通的 IP 地址,配置到 hosts 中

sudo vim /etc/hosts

写入
185.199.110.133 raw.githubusercontent.com

hosts 配置完成后,重启电脑即可生效。如果不想重启电脑,需要手动清除 DNS 缓存 + 重启网络服务
sudo dscacheutil -flushcache; sudo killall -HUP mDNSResponder
注意 Mac 版本不同,指令也会有区别

删除 node_modules 重新安装

[4/4] 

标签:node,gifsicle,19.0,仓库,安装,yarn,react,autoreconf,com
From: https://www.cnblogs.com/bibiafa/p/18212623

相关文章

  • reactk中useCallback的使用场景
    useCallback 是React中的一个Hook,用于优化性能并避免不必要的函数重新创建。在React中,当一个组件重新渲染时,其内部的函数也会被重新创建。这可能会导致向子组件传递的回调函数发生变化,从而导致子组件不必要地重新渲染。为了避免这种情况,可以使用 useCallback 来创建记忆......
  • 前端服务端React(Next.js)、Vue(Nuxt.js)、Angular(Universal)渲染搭建和开发案例
    前端服务端渲染(Server-SideRendering,简称SSR)是一种Web开发技术,它允许服务器动态生成HTML内容,然后将其发送到客户端,客户端再将这些HTML内容渲染成页面。这种方式可以提高首屏加载速度,改善SEO,以及提供更好的用户体验。前端服务端渲染搭建步骤:选择框架:选择支持服务端渲染......
  • React 入门 概念解释
    记录自己的学习过程,纯干货~一、项目初始化在(要新建项目的位置目录下)终端中打开<可以直接在文件夹用cmd或VSCode中打开>-输入npxcreate-react-appmy-project-name 搭建项目(需要些时间)-输入cdmy-project-name进入项目目录-输入npmstart启动项目,可以通过给到的......
  • 数据仓库——ETL(详细教程)
    目录建模方式ETL新建etl项目,设置项目名称位置新建数据源新建SSLS包做全量双击编辑执行SQL任务 双击编辑数据流任务编辑OLEDB源编辑数据流转换编辑OLEDB源目标右键选择执行做增量 编辑执行SQL任务编辑任务条件编辑数据流任务1编辑数据流任务2执行任务数......
  • React后台管理(八)-- 开发页面前准备---插槽以及函数组件传值
    文章目录前言一、插槽的使用1.父组件结构如下2.子组件接受插槽内容二、父子函数组件传值1.父组件传值给子组件(1)父组件定义属性传值给子组件(2)子组件通过props去接收属性值2.子组件传值父组件(1)父组件接收子组件的值,更新数据(2)子组件通过方法,将值传出给父组件,类似vue的......
  • React 中的useCallback
    useCallback 是React中的一个钩子函数,它用于创建一个稳定的回调函数,并且可以帮助优化性能。通常情况下,当父组件向子组件传递回调函数时,如果没有使用 useCallback,每次父组件重新渲染时,都会创建一个新的回调函数实例,这可能导致子组件不必要的重新渲染。使用 useCallback 可以......
  • powershell脚本批量拉取 git仓库文件
    #定义基础URL和数据库列表$BASE_URL="http://8.8.11.99:8999/yaya/"$DATABASES="common-service","bi-system","erp","gateway","pdm","plm","public-service","scm",&quo......
  • [oeasy]python018_ 如何下载github仓库_git_clone_下载仓库
    继续运行......
  • LlamaIndex RAG 和ReAct结合使用
    LlamaIndexRAG和ReAct结合使用示例代码:importosos.environ['OpenAI_API_KEY']='sk-pxxxxhU7F5Zrc'os.environ['SERPAPI_API_KEY']='950fbdxxxx9b0fexxxx'#加载电商财报数据fromllama_index.coreimportSimpleDirectoryReaderA_doc......
  • 离线文档(vue/react/element/element-plus/ands vue等等)
    特殊环境需要离线状态文档的请参考这里 可以在你所想要的东西在github的官方项目上找一个名字包含‘gh-page’或者‘get-page’的分支下载下来然后本地win+Rcmd输入npminstallsgo-g全局下载sgo之后在你下载下来的文件夹根目录cmd打开终端输入sgo--fallindex.html......