windows下flipper的安装使用

一、下载flipper源码并安装依赖

flipper github

git clone https://github.com/facebook/flipper.git
cd flipper/desktop
yarn
yarn start

二、下载watchman

运行yarn start时报错

Watchman:  Watchman was not found in PATH.  See https://facebook.github.io/watchman/docs/install.html for installation instructions
Failed to start watching for changes using Watchman Error: Watchman was not found in PATH.  See https://facebook.github.io/watchman/docs/install.html for installation instructions       
    at ChildProcess._handle.onexit (node:internal/child_process:285:19)
    at onErrorNT (node:internal/child_process:483:16)
    at process.processTicksAndRejections (node:internal/process/task_queues:90:21) {
  errno: -4058,
  code: 'ENOENT',
  syscall: 'spawn watchman',
  path: 'watchman',
  spawnargs: [ '--no-pretty', 'get-sockname' ]
}

 打开网址 https://facebook.github.io/watchman/docs/install.html,下载最新版本的watchman,解压后存入路径 E:\watchman-v2025.02.03.00-windows。右键计算机->属性->高级系统设置->环境变量->系统变量->path,新建条目 E:\watchman-v2025.02.03.00-windows\bin。

win+r打开cmd,输入watchman -v,显示版本号,证明watchman配置完成。

二、下载openSSL

重启电脑后再次运行yarn start报错

Failed to start FlipperServer Error: It looks like you don't have OpenSSL installed. Please install it to continue.  
    at ensureOpenSSLIsAvailable (E:\flipper\desktop\flipper-server\lib\app-connectivity\certificate-exchange\certificate-utils.js:80:15)
    at process.processTicksAndRejections (node:internal/process/task_queues:105:5)
    at async loadSecureServerConfig (E:\flipper\desktop\flipper-server\lib\app-connectivity\certificate-exchange\certificate-utils.js:89:5)
    at async ServerController.init (E:\flipper\desktop\flipper-server\lib\app-connectivity\ServerController.js:71:25)
    at async FlipperServerImpl.connect (E:\flipper\desktop\flipper-server\lib\FlipperServerImpl.js:421:13)
    at async start (E:\flipper\desktop\flipper-server\lib\startServer.js:186:5)
Flipper Server failed to initialize Error: It looks like you don't have OpenSSL installed. Please install it to continue.
    at ensureOpenSSLIsAvailable (E:\flipper\desktop\flipper-server\lib\app-connectivity\certificate-exchange\certificate-utils.js:80:15)
    at process.processTicksAndRejections (node:internal/process/task_queues:105:5)
    at async loadSecureServerConfig (E:\flipper\desktop\flipper-server\lib\app-connectivity\certificate-exchange\certificate-utils.js:89:5)
    at async ServerController.init (E:\flipper\desktop\flipper-server\lib\app-connectivity\ServerController.js:71:25)
    at async FlipperServerImpl.connect (E:\flipper\desktop\flipper-server\lib\FlipperServerImpl.js:421:13)
    at async start (E:\flipper\desktop\flipper-server\lib\startServer.js:186:5)

 官网下载最新3.3.2 light版本的exe文件,一路点击next安装完成,配置环境变量<openssl 安装路径>\bin

下载最新版本的openssl可能会遇到报错

[conn][error] [ 'Failed to exchange certificate', Error: Warning: error while verifying CSR self-signature

三、使用flipper调试react native应用

本人使用的rn版本是0.73.0。

1. react devtools不可用

分别运行flipper和react native的启动命令npm start,对应的设备会自动连接到flipper,当Sidebar旁边选择的是具体的应用时,react devtools会显示不可用。

解决方案就是切换Sidebar旁边的选择器选择react native.

flipper在v0.239.0后不再支持react native,所以需要降级到v0.239.0。

git checkout v0.239.0
yarn
yarn start

2. hermes debugger不可用

降级后hermes debugger仍然无法使用,github讨论区里有人指出v0.237.0版本中可以正常使用,但本人降级到该版本仍然无法使用。

不过在0.237.0版本中,在选择具体应用的情况下可以使用react devtools,这解决了不选择具体应用时无法使用network plugin的问题。

考虑到react native在0.73版本已经不推荐用flipper进行调试,这里采用chrome debugger作为替代方案。Debugging Basics · React Native

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值