title: AuthError - Username cannot be empty
body: <p>I created SignUp page for My React App,Later Im trying to store those SignUp Information in AWS Amplify, I follow the Documentation Steps to store SignUp Information in Amplify after finishing the Work,I expected all the information are stored Online,But That was Wrong.,I got Below ERROR</p>
  <pre><code>[ERROR] 55:29.258 AuthError - Username cannot be empty
  console.&lt;computed&gt; @ index.js:1
  SignUp.js:20 AuthError: Username cannot be empty
      at new AuthError (http://localhost:3000/static/js/vendors~main.chunk.js:10816:20)
      at AuthClass.rejectAuthError (http://localhost:3000/static/js/vendors~main.chunk.js:10734:27)
      at AuthClass.signUp (http://localhost:3000/static/js/vendors~main.chunk.js:8550:19)
      at signUp (http://localhost:3000/static/js/main.chunk.js:1406:62)
      at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/vendors~main.chunk.js:376157:18)
      at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/vendors~main.chunk.js:376206:20)
      at invokeGuardedCallback (http://localhost:3000/static/js/vendors~main.chunk.js:376266:35)
      at invokeGuardedCallbackAndCatchFirstError (http://localhost:3000/static/js/vendors~main.chunk.js:376281:29)
      at executeDispatch (http://localhost:3000/static/js/vendors~main.chunk.js:380516:7)
      at processDispatchQueueItemsInOrder (http://localhost:3000/static/js/vendors~main.chunk.js:380548:11)
      at processDispatchQueue (http://localhost:3000/static/js/vendors~main.chunk.js:380561:9)
      at dispatchEventsForPlugins (http://localhost:3000/static/js/vendors~main.chunk.js:380572:7)
      at http://localhost:3000/static/js/vendors~main.chunk.js:380783:16
      at batchedEventUpdates$1 (http://localhost:3000/static/js/vendors~main.chunk.js:394468:16)
      at batchedEventUpdates (http://localhost:3000/static/js/vendors~main.chunk.js:375955:16)
      at dispatchEventForPluginEventSystem (http://localhost:3000/static/js/vendors~main.chunk.js:380782:7)
      at attemptToDispatchEvent (http://localhost:3000/static/js/vendors~main.chunk.js:378265:7)
      at dispatchEvent (http://localhost:3000/static/js/vendors~main.chunk.js:378183:23)
      at unstable_runWithPriority (http://localhost:3000/static/js/vendors~main.chunk.js:413814:16)
      at runWithPriority$1 (http://localhost:3000/static/js/vendors~main.chunk.js:383563:14)
      at discreteUpdates$1 (http://localhost:3000/static/js/vendors~main.chunk.js:394485:18)
      at discreteUpdates (http://localhost:3000/static/js/vendors~main.chunk.js:375967:16)
      at dispatchDiscreteEvent (http://localhost:3000/static/js/vendors~main.chunk.js:378149:7)
   
  
  
  Here Is The Code:
  
  
  
      import React,{useState} from 'react'
      import Amplify,{Auth} from 'aws-amplify'
      import awsconfig from &quot;../SignProperties/aws-exports&quot;
      Amplify.configure(awsconfig)
      function SignUp() {
          const initialValues={username:&quot;&quot;,password:&quot;&quot;,email:&quot;&quot;,phoneNumber:&quot;&quot;}
          const [loginAttributes,setLoginAttributes]=useState(initialValues)
          const onChange=(e)=&gt;{
              setLoginAttributes({[e.target.name]:e.target.value})
      
          }
          const signUp=async()=&gt;{
              const {username,password,email,phoneNumber}=loginAttributes
              try{
                  await Auth.signUp({username,password,attributes:{
                      email,phoneNumber
                  }
              })
              console.log(&quot;Succesful&quot;)}
              catch(error){console.log(error)}
          }
          return (
              &lt;div className=&quot;signUpScreen&quot;&gt;
                  &lt;input onChange={onChange} name=&quot;username&quot; placeholder=&quot;username&quot; &gt;&lt;/input&gt;
                  &lt;input onChange={onChange} name=&quot;password&quot; placeholder=&quot;password&quot; type=&quot;password&quot;&gt;&lt;/input&gt;
                  &lt;input onChange={onChange} name=&quot;Email&quot; placeholder=&quot;Email&quot; type=&quot;email&quot;&gt;&lt;/input&gt;
                  &lt;input onChange={onChange} name=&quot;Phone_Number&quot; placeholder=&quot;Phone_Number&quot; type=&quot;number&quot;&gt;&lt;/input&gt;
                  &lt;button onClick={signUp}&gt; Sign Up&lt;/button&gt;
              &lt;/div&gt;
          )
      }
      
      export default SignUp
  </code></pre>
  <p>Please Help to find Out The Error i have Done</p>