![](/img/trans.png)
[英]ERROR in ./src/index.js Module build failed (from ./node_modules/babel-loader/lib/index.js):
[英]./node_modules/firebase/index.js Error: ENOENT: no such file or directory
由于某种原因,我的 firebase 模块出现错误,无法接收。 这是我在 VS 代码上的文件结构:
这些是我需要从 firebase 导入身份验证的 2 个文件:
登录.js
import React, {useState} from 'react';
import "./Login.css";
import {Link, useHistory} from "react-router-dom";
import { auth } from "../firebase"
function Login() {
const history = useHistory()
const [email,setEmail] = useState("");
const [password,setPassword] = useState("")
const login = (e) => {
e.preventDefault();
auth
.signInWithEmailAndPassword(email,password)
.then((auth) =>{
history.push('/');
})
.catch(e=>alert(e.message))
}
const register = (e) => {
e.preventDefault();
auth
.createUserInWithEmailAndPassword(email,password)
.then((auth) => {
history.push('/');
})
.catch(e=>alert(e.message))
}
return (
<div className="login">
<Link to="/">
<img className="login__logo"
src="http://pngimg.com/uploads/amazon/amazon_PNG24.png"
alt=""
/>
</Link>
<div className = "login__container">
<h1>Sign in </h1>
<form>
<h5>Email</h5>
<input value={email} onChange = {event => setEmail(event.target.value)} type="email"/>
<h5>Password</h5>
<input value={password} onChange = {event => setPassword(event.target.value)} type="password"/>
<button onClick = {login} type="submit" className = "login__signInButton"> Sign in</button>
</form>
<p>
By signing-in you agree to Amazon's Conditions of Use & Sale. Please see our Privacy Notice, our Cookies Notice and our Interest-Based Ads Notice
</p>
<button onClick = {register} className="login__registerButton">Create your Amazon Account</button>
</div>
</div>
)
}
export default Login
应用程序.js
import React, {useEffect} from "react";
import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
import "./App.css";
import Header from "./components/Header";
import Home from "./components/Home";
import Checkout from "./components/Checkout";
import Login from "./components/Login";
import { useStateValue } from "./StateProvider";
import { auth } from "./firebase";
function App() {
const [{user},dispatch] = useStateValue();
useEffect(() =>{
const unsubscribe = auth.onAuthStateChanged((authUser) =>{
if(authUser){
dispatch({
type:"SET_USER",
user: authUser
})
}else{
dispatch({
type:"SET_USER",
user: null
})
}
});
return () => {
unsubscribe();
}
},[])
console.log("USER is >>>", user);
return (
<Router>
<Switch>
<Route path="/checkout">
<Header />
<Checkout />
</Route>
<Route path="/login">
<Login/>
</Route>
<Route path="/">
<Header />
<Home />
</Route>
</Switch>
</Router>
);
}
export default App;
我尝试了不同的东西,但仍然选择错误的文件并给我一个错误。 试过 npm i 和 npm i firebase 都没有用。
谢谢
不确定这是否会有所帮助,但是当我将 firebase 升级到 7.24.0 版时发生了确切的事情。
我将版本改回 7.16.0,现在可以使用了。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.