我正在尝试在我的 React 应用程序中实现 firebase，但我的导入版本似乎已经过时。这是我的代码：
import firebase from "firebase/app";
import "firebase/auth";
const app = firebase.initializeApp({
apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_ID,
appId: process.env.REACT_APP_FIREBASE_APP_ID,
});
export const auth = app.auth();
export default app;
我已经用 process.env.REACT_APP_FIREBASE... 替换了我的配置键，因为它们存储在另一个本地 .env 文件中。我也尝试了不同的导入 firebase 的方法，但似乎大多数帖子都过时了。这是我得到的错误：
./src/firebase.js 尝试导入错误：“firebase/app”不包含默认导出（作为“firebase”导入）。
我还有另一个 authContext 文件，所以我需要在我的 firebase.js 文件中保留 'auth' 关键字：
import React, { useContext, useState, useEffect } from "react";
import { auth } from "../firebase";
const AuthContext = React.createContext();
export function useAuth() {
return useContext(AuthContext);
}
const AuthProvider = ({ children }) => {
const [currentUser, setCurrentUser] = useState();
function signup(email, password) {
return auth.createUserWithEmailAndPassword(email, password);
}
useEffect(() => {
const unsubscribe = auth.onAuthStateChanged((user) => {
setCurrentUser(user);
});
return unsubscribe;
}, []);
const value = {
currentUser,
signup,
};
return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
};
export default AuthProvider;