25
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

'AmplifySignOut' is not exported from '@aws-amplify/ui-react'.を解消する

Last updated at Posted at 2021-11-21

##はじめに
この記事は、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すると
スクリーンショット 2021-11-21 21.26.12.png
解決しましたね!

##参考
以下でも質問が出てました。
reactjs - 'AmplifySignOut' is not exported from '@aws-amplify/ui-react' - Stack Overflow
「v1.2.5にダウングレードしろ」って回答だけどどうやってversion判断してるんですかね。
npmjs.comの見方、勉強しないとな。

##追記
この時は気づかなかったのですが、よく見たら Node.js がLTS版じゃないですね。

25
4
4

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
25
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?