反应：未处理的拒绝（TypeError）：firebase__WEBPACK_IMPORTED_MODULE_1__答案

【问题标题】：React: Unhandled Rejection (TypeError): firebase__WEBPACK_IMPORTED_MODULE_1__反应：未处理的拒绝（TypeError）：firebase__WEBPACK_IMPORTED_MODULE_1__
【发布时间】：2021-01-06 09:15:25
【问题描述】：

我在尝试登录时遇到此错误，请任何人帮助我

未处理的拒绝 (TypeError)：firebase__WEBPACK_IMPORTED_MODULE_1___default.a.signInWithEmailAndPassword 不是函数

enter image description here

import React, { useState } from 'react'
import auth  from '../node_modules/firebase';

const Login = () => {
    const [username, setUsername ] = useState('');
    const [password, setPassword ] = useState('');
    
     const handleLogin = async () => {
        
          const response = await auth.signInWithEmailAndPassword(
            username,
            password
          );
    
          const { user } = response;
    
        }

        const handleUsername = event => {
            setUsername(event.target.value)
        }

        const handlePassword = event => {
            setPassword(event.target.value)
        }
        return(
            <div>
                <div className="container col-md-4 col-sm-10 mt-5">
                  <div class="card shadow">
                      <form className="container mt-4" >
                         <div class="form-group">
                          <input type="email" class="form-control" 
                           placeholder="Email"  onChange={handleUsername}/>
                         </div>
                         <div class="form-group">
                          <input type="password" class="form-control" 
                          placeholder="password"  onChange={handlePassword}/>
                         </div>
                        <div className="container d-flex justify-content-center mb-3">
                           <a  className="btn btn-warning col-md-7 col-sm-12" 
                           type="submit" onClick={handleLogin}>Log in</a>
                        </div>   
                     </form>
                 </div>
               </div>
            </div>
        )

【问题讨论】：

标签： javascript reactjs firebase firebase-authentication

【解决方案1】：

这不会像你期望的那样工作：

import auth  from '../node_modules/firebase';

如果您想导入 Firebase 库，您应该按照documentation 中的说明进行操作。这可能会更好：

import * as firebase from "firebase/app";
import "firebase/auth";
const auth = firebase.auth();

【讨论】：