はじめに
この記事は、AWS Amplifyハンズオンである「AWS で React アプリケーションを構築する」を行っていた際に詰まった箇所のメモになります。
つまづきポイント
「モジュール 3 - AWS で React アプリケーションを構築する」の後半、
「アプリをローカルで実行する」のところでnpm startしてもうまく動かなかった。
具体的には以下のエラーが出て進めなくなってしまう。
./src/App.js
Attempted import error: 'AmplifySignOut' is not exported from '@aws-amplify/ui-react'.
動作環境の確認
必要情報はNodeとAmplifyCLIくらいですかね？
ちなみに今見たらAmplify CLI 7.4.4が出てますね。
- Node v17.0.1
- Amplify CLI 7.4.2
こうして解決した
試しに、node_modulesを消してインストールしなおしても同様の事象だったので@aws-amplifyかui-reactをダウングレードすることにした。
まずはパッケージのバージョン確認。
% npm list --depth=0
amplifyreact@0.1.0 /Users/hogehoge/workspace/Handson/amplifyreact
├── @aws-amplify/ui-react@2.0.0
├── @testing-library/jest-dom@5.15.0
├── @testing-library/react@11.2.7
├── @testing-library/user-event@12.8.3
├── aws-amplify@4.3.8
├── react-dom@17.0.2
├── react-scripts@4.0.3
├── react@17.0.2
└── web-vitals@1.1.2
@aws-amplify/ui-react@2.0.0
多分悪いのはこいつだ。
@aws-amplify/ui-react - npmでv2.0.0の前の安定版を探すとおそらくv1.2.25が良さそう。
% npm remove @aws-amplify/ui-react
% npm install @aws-amplify/ui-react@1.2.25
そして、npm startすると
解決しましたね！
参考
以下でも質問が出てました。
reactjs - 'AmplifySignOut' is not exported from '@aws-amplify/ui-react' - Stack Overflow
「v1.2.5にダウングレードしろ」って回答だけどどうやってversion判断してるんですかね。
npmjs.comの見方、勉強しないとな。
追記
この時は気づかなかったのですが、よく見たら Node.js がLTS版じゃないですね。