AWS Amplify & React Native - Unable to resolve “@aws-amplify/ui/dist/style.css”

Question

I'm attempting to customize the AWS Amplify UI signin/signup process by following this article . Every time I import anything from aws-amplify-react I receive this error:

Unable to resolve "@aws-amplify/ui/dist/style.css" from "node_modules/aws-amplify-react/dist/Amplify-UI/Amplify-UI-Components-React.js"

I've tried installing @aws-amplify/ui specifically, along with other combinations of aws-amplify versions. Here's the relevant part of my package.json :

...
"aws-amplify": "^1.1.25",
"aws-amplify-react": "^2.3.5",
"aws-amplify-react-native": "^2.1.9",
...

And the versions of the specific UI & auth that I've tried:

"@aws-amplify/auth": "^1.2.21",
"@aws-amplify/ui": "^1.0.2",

Here is the import statement:

import { ConfirmSignIn, ConfirmSignUp, ForgotPassword, RequireNewPassword, SignIn, SignUp, VerifyContact, withAuthenticator } from 'aws-amplify-react';

Any help on resolving this issue is greatly appreciated.

Answer 1

Just ran into this issue as well today.

The issue was using aws-amplify-react instead of aws-amplify-react-native . So go ahead and npm uninstall the react version, and npm install the react-native version.

The subtly mentioned this with a comment in that doc you linked:

import { withAuthenticator } from 'aws-amplify-react'; // or 'aws-amplify-react-native';