由于 React Native svg 图表的依赖问题，无法在 Expo 上构建我的应用程序

Question

我最近制作了一个应用程序，正在尝试为 TestFlight 构建它。

在我的应用程序中，我开始使用react-native-svg-charts，它使用react-native-svg。

这些是我的 package.json 中的版本： "react-native-svg": "^15.3.0", "react-native-svg-charts": "^5.4.0", “react-native-chart-kit”：“^6.12.0”，

当我执行 npx expo start 时，我可以看到我的应用程序运行并且没问题，当我执行

eas build --platform iOS

时，构建会失败，因为：

Running "npm install" in /Users/expo/workingdir/build directory
npm
ERR! code ERESOLVE
npm ERR!
ERESOLVE could not resolve
npm ERR!
npm
ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react-native-svg
npm ERR!   react-native-svg@"^15.3.0" from the root project
npm ERR!   peer react-native-svg@"> 6.4.1" from [email protected]
npm ERR!   node_modules/react-native-chart-kit
npm ERR!     react-native-chart-kit@"^6.12.0" from the root project
npm ERR!   1 more (react-native-gifted-charts)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react-native-svg@"^6.2.1||^7.0.3" from [email protected]
npm ERR! node_modules/react-native-svg-charts
npm ERR!   react-native-svg-charts@"^5.4.0" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: [email protected]
npm
ERR! node_modules/react-native-svg
npm ERR!   peer react-native-svg@"^6.2.1||^7.0.3" from [email protected]
npm ERR!   node_modules/react-native-svg-charts
npm ERR!     react-native-svg-charts@"^5.4.0" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! 
npm ERR! For a full report see:
npm ERR! /Users/expo/.npm/_logs/2024-06-16T18_10_33_225Z-eresolve-report.txt
npm ERR! A complete log of this run can be found in: /Users/expo/.npm/_logs/2024-06-16T18_10_33_225Z-debug-0.log
npm install exited with non-zero code: 1

当我执行 npm install 时，我得到：

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react-native-svg
npm ERR!   react-native-svg@"^15.3.0" from the root project
npm ERR!   peer react-native-svg@"> 6.4.1" from [email protected]
npm ERR!   node_modules/react-native-chart-kit
npm ERR!     react-native-chart-kit@"^6.12.0" from the root project
npm ERR!   1 more (react-native-gifted-charts)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react-native-svg@"^6.2.1||^7.0.3" from [email protected]
npm ERR! node_modules/react-native-svg-charts
npm ERR!   react-native-svg-charts@"^5.4.0" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/react-native-svg
npm ERR!   peer react-native-svg@"^6.2.1||^7.0.3" from [email protected]
npm ERR!   node_modules/react-native-svg-charts
npm ERR!     react-native-svg-charts@"^5.4.0" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! 
npm ERR! For a full report see:
npm ERR! /Users/niloufar/.npm/_logs/2024-06-16T18_14_27_517Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in: /Users/niloufar/.npm/_logs/2024-06-16T18_14_27_517Z-debug-0.log

因此，如果我这样做，就会出现一些依赖性问题： npm 卸载react-native-svg

npm i [电子邮件受保护]

然后我可以执行 npm install，但是当我执行 npx expo start 时，我得到：

Invariant Violation: "main" has not been registered. This can happen if: * Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project. * A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called., js engine: hermes 

我已经没有想法了，无论我做什么，我都会遇到一些错误。我需要不使用react-native-svg-charts吗？

Answer 1

您已经正确解决了依赖冲突，但是其他原因正在阻止应用程序运行并导致“不变违规”。

我建议清除 Metro 缓存，重新安装依赖项，重新启动 Metro 并再次运行应用程序，同时仔细检查 Metro 日志和设备日志。您应该会看到在违反不变性之前发生错误。

如果您确认错误是由

[email protected]

引起的，您可以尝试使用较新的版本：

react-native-svg@^7.0.3

或v6：

react-native-svg@^6.2.1

Answer 2

我通过分叉react-native-svg-charts存储库解决了这个问题。我更新了 package.json 文件中的版本号以匹配我的应用程序中使用的版本。

进行这些更改后，我将修改后的库安装到我的项目中，成功解决了问题。