如何解决 AWS Amplify 引起的对等依赖问题？

Question

我的 React 构建遇到问题，可能与 AWS amplify 有关，但我\xe2\x80\x99m 无法确定它。

\n

当它启动时，我可以毫无问题地在本地运行我的程序。我将其上传到 GitHub，并且我的 CI/CD 设置和 amplify 尝试构建它。Amplify 表示它在构建过程中损坏了。那时我发现我无法\xe2\x80\x99t运行npm update。

\n

我\xe2\x80\x99已经把它弄乱了很多，并且可能进一步弄乱了环境。如果有人有任何建议，我\xe2\x80\x99d 非常感激。

\n

我最初遇到的错误是这样的：

\n

npm WARN ERESOLVE overriding peer dependency\nnpm ERR! code ERESOLVE\nnpm ERR! ERESOLVE could not resolve\nnpm ERR! \nnpm ERR! While resolving: react-drag-drop-files@2.3.7\nnpm ERR! Found: react@16.14.0\nnpm ERR! node_modules/react\nnpm ERR!   peer react@"18.1.0" from react-native@0.70.6\nnpm ERR!   node_modules/react-native\nnpm ERR!     peer react-native@">=0.56" from react-native-get-random-values@1.7.0\nnpm ERR!     node_modules/react-native-get-random-values\nnpm ERR!       react-native-get-random-values@"^1.4.0" from @aws-sdk/middleware-retry@3.6.1\nnpm ERR!       node_modules/@aws-sdk/middleware-retry\nnpm ERR!         @aws-sdk/middleware-retry@"3.6.1" from @aws-sdk/client-cognito-identity@3.6.1\nnpm ERR!         node_modules/@aws-sdk/client-cognito-identity\nnpm ERR!         11 more (@aws-sdk/client-comprehend, ...)\nnpm ERR!     peer react-native@"^0.0.0-0 || 0.60 - 0.71 || 1000.0.0" from @react-native-async-storage/async-storage@1.17.11\nnpm ERR!     node_modules/@react-native-async-storage/async-storage\nnpm ERR!       peer @react-native-async-storage/async-storage@"^1.13.0" from @aws-amplify/core@4.0.2\nnpm ERR!       node_modules/@aws-amplify/core\nnpm ERR!         @aws-amplify/core@"4.0.2" from @aws-amplify/analytics@5.0.0\nnpm ERR!         node_modules/@aws-amplify/analytics\nnpm ERR!         11 more (@aws-amplify/api-graphql, @aws-amplify/api-rest, ...)\nnpm ERR!       1 more (amazon-cognito-identity-js)\nnpm ERR! \nnpm ERR! Could not resolve dependency:\nnpm ERR! peer react@"^18.0.0" from react-drag-drop-files@2.3.7\nnpm ERR! node_modules/react-drag-drop-files\nnpm ERR!   react-drag-drop-files@"^2.3.7" from the root project\nnpm ERR! \nnpm ERR! Conflicting peer dependency: react@18.2.0\nnpm ERR! node_modules/react\nnpm ERR!   peer react@"^18.0.0" from react-drag-drop-files@2.3.7\nnpm ERR!   node_modules/react-drag-drop-files\nnpm ERR!     react-drag-drop-files@"^2.3.7" from the root project\n

\n

完全卸载react-drag-drop-files也没有帮助，它只是用另一个依赖问题替换了它；

\n

我看到的建议大多是在执行 npm config set Legacy-peer-deps=true 后重新安装。这看起来并不理想，但我无法找到如何实际解决依赖冲突的具体描述。我尝试卸载并重新安装相关模块，但这不起作用。

\n

最后，我确实尝试启用旧版对等部门并删除我的模块，然后重新安装。这也不起作用，并在尝试本地运行时给我留下了这个错误：

\n

./node_modules/aws-amplify-react/lib-esm/Amplify-UI/Amplify-UI-Components-React.js\n尝试导入错误：“a”未从“@aws-amplify/ui”导出（导入为'放大用户界面'）。

\n

我也无法解决这个问题。所以我再次删除了模块，再次运行npm install，现在我\xe2\x80\x99m又回到了原来的错误。

\n

Answer 1

我遇到了完全相同的问题，但使用 --legacy-peer-deps 应该可以。然而，您可能仅在本地运行它，而不是在 Amplify 中构建应用程序时运行它。

转到 AWS Amplify 中的应用程序，然后从侧边栏菜单中选择构建设置。接下来只需更换

preBuild:
 commands:
   - npm ci

和：

preBuild:
 commands:
   - npm ci --legacy-peer-deps

这至少对我有用，希望有帮助！

文档：https ://docs.aws.amazon.com/amplify/latest/userguide/build-settings.html