Me encontré con este problema hoy, y recién comenzó hoy. Ejecutó la secuencia habitual de instalaciones y pulsaciones para compilar la aplicación...
npx create-react-app exampleapp npm start amplify init amplify add api Amplify push npm install aws-amplify @aws-amplify/ui-react amplify add auth amplify pushRealice mis cambios en index.js y ap.js como de costumbre.
índice.js:
import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; import Amplify from 'aws-amplify'; import aws_exports from './aws-exports' Amplify.configure(aws_exports); ReactDOM.render( <React.StrictMode> <App /> </React.StrictMode>, document.getElementById('root') ); reportWebVitals();Aplicación.js:
import React from 'react'; import './App.css'; import { withAuthenticator, AmplifySignOut, Authenticator } from '@aws-amplify/ui-react'; import { Amplify, Auth } from 'aws-amplify'; import awsExports from './aws-exports'; import awsconfig from './aws-exports'; Amplify.configure(awsconfig); Auth.configure(awsconfig); function App() { return ( <div> <h1>Help!</h1> <AmplifySignOut /> </div> ); } export default withAuthenticator(App);Si agrego AmplifySignOut, arroja el error: 'AmplifySignOut' no se exporta desde '@aws-amplify/ui-react'
Si elimino AmplifySignOut, aparece el inicio de sesión pero no tiene formato según el estilo de autenticación de Amazon (botón naranja, etc.).
Puedo agregar import '@aws-amplify/ui-react/styles.css'; y recuperé algo de estilo, pero realmente necesito que las cosas vuelvan a funcionar. ¡Cualquier ayuda sería apreciada!
Estoy siguiendo el tutorial de Amplify y también me encontré con este obstáculo. Parece que acaban de actualizar los componentes de reacción de 1.2.5 a 2.0.0 https://github.com/aws-amplify/docs/pull/3793
Al degradar ui-react a 1.2.5, se recupera AmplifySignOut y otros componentes utilizados en los tutoriales.
en paquete.json :
"dependencies": { "@aws-amplify/ui-react": "^1.2.5", ... }Alternativamente, deberá buscar en los documentos de la versión 2 para encontrar reemplazos adecuados: https://ui.docs.amplify.aws/components/authenticator
Aquí hay un ejemplo que incorpora una versión reciente de ui-react (v2.1.2) y los documentos actualizados de ui.docs.amplify:
import React from 'react'; import './App.css'; import { Authenticator } from '@aws-amplify/ui-react'; import '@aws-amplify/ui-react/styles.css'; function App() { return ( <Authenticator> {({ signOut, user }) => ( <div className="App"> <p> Hey {user.username}, welcome to my channel, with auth! </p> <button onClick={signOut}>Sign out</button> </div> )} </Authenticator> ); } export default App;Tuve el mismo problema y encontré la respuesta en https://ui.docs.amplify.aws/ . Instalé la versión más reciente de @aws-amplify/ui-react. (npm i aws-amplify @aws-amplify/ui-react)