运行GitHub开源Tinder区块链Web应用时遇Module not found错误求助

问题原因 #

错误源于react-panresponder-web包依赖了react-dom/unstable-native-dependencies，这个模块在新版React/ReactDOM中已被移除，而项目中的react-tinder-card版本依赖了这个过时的包。

解决方案 #

方案1：升级react-tinder-card到最新版本 #

新版react-tinder-card已移除对react-panresponder-web的依赖，直接升级即可解决问题：

npm install react-tinder-card@latest
# 或使用yarn
yarn add react-tinder-card@latest

方案2：用patch-package修复依赖问题 #

如果升级后项目存在兼容性问题，可通过补丁修改react-panresponder-web的依赖：

1. 安装patch-package开发依赖：

npm install patch-package --save-dev
# 或yarn
yarn add patch-package --dev

2. 打开node_modules/react-panresponder-web/dist/panresponder.js，找到第7行的导入语句：

import * as unstableNativeDependencies from 'react-dom/unstable-native-dependencies';

替换为：

import * as unstableNativeDependencies from 'react-dom';

3. 生成补丁文件：

npx patch-package react-panresponder-web

后续执行npm install或yarn install时，补丁会自动应用。

方案3：替换为替代库 #

若上述方案都不适用，可考虑替换react-tinder-card为其他类似库（如react-swipeable-cards），需对应修改components/TinderCardItem.js等相关组件的代码适配新库。

内容的提问来源于stack exchange，提问作者Ian Black