AWSのAmplifyで認証機能を入れてHostedUIのログインページを表示させようとしたら、以下のようなエラーが発生。
Can't resolve '@aws-amplify/core/internals/utils
とりあえずないと言われてるので、以下コマンドでaws-amplify/coreを入れてみる
npm install @aws-amplify/core --save --legacy-peer-deps
すると～フォルダが空っぽじゃありません、みたいなエラーが発生
npm ERR! ENOTEMPTY: directory not empty, rmdir 'D:\narejiro\node_modules\axios'
指摘されたフォルダを手で削除して再度実行
npm install @aws-amplify/core --save --legacy-peer-deps
するとまた～フォルダが空っぽじゃありません、みたいなエラーが発生
npm ERR! ENOTEMPTY: directory not empty, rmdir 'D:\narejiro\node_modules\@aws-crypto\sha256-browser\node_modules\@aws-crypto'
再び指摘されたフォルダを手で削除して再度実行
npm install @aws-amplify/core --save --legacy-peer-deps
するとインストール成功したっぽい。npmで立ち上げてみると、
Module not found: Error: Can't resolve 'axios' in 'D:\project\src\graphql'
あれ、これさっきこれのフォルダが空じゃないっていうエラーが出たから消したフォルダですよね。確かにこれ使ってるからそりゃないとエラーになるよね。なので再度インストール
npm install axios
すると今度は別の依存関係のエラーが発生
npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: aws-amplify-react@5.1.43 npm ERR! Found: @aws-amplify/core@6.0.27 npm ERR! node_modules/@aws-amplify/core npm ERR! @aws-amplify/core@"^6.0.27" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer @aws-amplify/core@"3.x.x" from aws-amplify-react@5.1.43 npm ERR! node_modules/aws-amplify-react npm ERR! aws-amplify-react@"^5.1.43" from the root project npm ERR! npm ERR! Conflicting peer dependency: @aws-amplify/core@3.8.24 npm ERR! node_modules/@aws-amplify/core npm ERR! peer @aws-amplify/core@"3.x.x" from aws-amplify-react@5.1.43 npm ERR! node_modules/aws-amplify-react npm ERR! aws-amplify-react@"^5.1.43" 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! D:\Users\a2182258\AppData\Local\npm-cache\_logs\2024-04-20T05_39_59_400Z-eresolve-report.txt
このフォルダは古いバージョン用で不要なので「aws-amplify-react」フォルダも手で削除。さらにpackage.jsonやpackage-lock.jsonの中の「aws-amplify-react」の部分も削除して再度axiosをインストール
npm install axios
さらに以下コマンドを実行し、package.jsonの内容をpackage-lock.jsonに反映させる
npm install
エラーがなくなったことを確認し、起動
npm start
→成功 !!! やっぱりamplifyみたいな全部やってくれる系ライブラリは一発でいけば便利だけど、つまづくと大変。。
