未找到 Firebase 导入。

huangapple
go评论89阅读模式
英文:

Not find firebase import

问题

这是我的firebase.js

  1. import { initializeApp } from 'firebase/app';
  2. import { getAuth } from 'firebase/auth';
  3. import { getStorage } from 'firebase/storage';
  4. import { getFirestore } from 'firebase/firestore';
  6. const firebaseConfig = {
  7.     apiKey: 'AIzaSyCUndICAUxUT3n_Q19F05BazSpLOkr2d1c',
  8.     authDomain: 'chat-e7246.firebaseapp.com',
  9.     projectId: 'chat-e7246',
  10.     storageBucket: 'chat-e7246.appspot.com',
  11.     messagingSenderId: '28357679434',
  12.     appId: '1:28357679434:web:58376c850f47e39fb689b3',
  13.     measurementId: 'G-VE6BZN6595',
  14. };
  16. // Initialize Firebase
  17. export const app = initializeApp(firebaseConfig);
  18. export const auth = getAuth();
  19. export const storage = getStorage();
  20. export const db = getFirestore();

当我尝试在user.jsx文件中使用它来创建数据库时，出现如下错误：Error registering user: TypeError: firebase__WEBPACK_IMPORTED_MODULE_6_.auth.createUserWithEmailAndPassword 不是一个函数。

英文:

This is my firebase.js

  1. import { initializeApp } from 'firebase/app';
  2. import { getAuth } from 'firebase/auth';
  3. import { getStorage } from 'firebase/storage';
  4. import { getFirestore } from 'firebase/firestore';
  6. const firebaseConfig = {
  7.     apiKey: 'AIzaSyCUndICAUxUT3n_Q19F05BazSpLOkr2d1c',
  8.     authDomain: 'chat-e7246.firebaseapp.com',
  9.     projectId: 'chat-e7246',
  10.     storageBucket: 'chat-e7246.appspot.com',
  11.     messagingSenderId: '28357679434',
  12.     appId: '1:28357679434:web:58376c850f47e39fb689b3',
  13.     measurementId: 'G-VE6BZN6595',
  14. };
  16. // Initialize Firebase
  17. export const app = initializeApp(firebaseConfig);
  18. export const auth = getAuth();
  19. export const storage = getStorage();
  20. export const db = getFirestore();

When i try to use it to create DB in user.jsx file

  1. import { auth, db } from '~/firebase';
  2. const onSubmit = (data) => {
  3.         setFormData({
  4.             email: data.email,
  5.             fullname: data.fullname,
  6.             username: data.username,
  7.             password: data.password,
  8.             confirmPassword: data.confirmPassword,
  9.         });
  10.     };
  12.     const registerUser = async () => {
  13.         try {
  14.             const { user } = await auth.createUserWithEmailAndPassword(formData.email, formData.password);
  15.             await db.collection('users').doc(user.uid).set(formData);
  17.             return user;
  18.         } catch (error) {
  19.             console.error('Error registering user:', error);
  20.             throw error;
  21.         }
  22.     };

The error comes like this : Error registering user: TypeError: firebase__WEBPACK_IMPORTED_MODULE_6_.auth.createUserWithEmailAndPassword is not a function

答案1

得分: 1

你的配置文件 firebase.js 不正确。你应该将 app 变量作为参数传递给 getAuth、getStorage 和 getFirestore 函数...
像这样：

  1. // 初始化 Firebase
  2. export const app = initializeApp(firebaseConfig);
  3. export const auth = getAuth(app);
  4. export const storage = getStorage(app);
  5. export const db = getFirestore(app);
英文:

Your configuration file firebase.js isn't right. You should pass app variable as argument to getAuth, getStorage, and getFirestore function...
Like this:

  1. // Initialize Firebase
  2. export const app = initializeApp(firebaseConfig);
  3. export const auth = getAuth(app);
  4. export const storage = getStorage(app);
  5. export const db = getFirestore(app);

答案2

得分: 1

是的，我遵循了指南，传递了app变量但仍然出现错误。然后我通过以下方式修复它：

  1.  const onSubmit = (data) => {
  2.         setFormData({
  3.             email: data.email,
  4.             fullname: data.fullname,
  5.             username: data.username,
  6.             password: data.password,
  7.             confirmPassword: data.confirmPassword,
  8.         });
  9.     };
  11.     const registerUser = async () => {
  12.         try {
  13.             const { user } = await createUserWithEmailAndPassword(auth, formData.email, formData.password);
  14.             await setDoc(doc(db, 'users', user.uid), {
  15.                 username: formData.username,
  16.                 password: formData.password,
  17.                 email: formData.email,
  18.             });
  20.             return user;
  21.         } catch (error) {
  22.             console.error('Error registering user:', error);
  23.             throw error;
  24.         }
  25.     };

这是我的firebase.js

  1. export const app = initializeApp(firebaseConfig);
  2. export const auth = getAuth(app);
  3. export const storage = getStorage(app);
  4. export const db = getFirestore(app);
英文:

Yeah, after I follow the guide and pass app variable but still error. Then I fix it by doing this :

  1.  const onSubmit = (data) => {
  2.         setFormData({
  3.             email: data.email,
  4.             fullname: data.fullname,
  5.             username: data.username,
  6.             password: data.password,
  7.             confirmPassword: data.confirmPassword,
  8.         });
  9.     };
  11.     const registerUser = async () => {
  12.         try {
  13.             const { user } = await createUserWithEmailAndPassword(auth, formData.email, formData.password);
  14.             await setDoc(doc(db, 'users', user.uid), {
  15.                 username: formData.username,
  16.                 password: formData.password,
  17.                 email: formData.email,
  18.             });
  20.             return user;
  21.         } catch (error) {
  22.             console.error('Error registering user:', error);
  23.             throw error;
  24.         }
  25.     };

And this is my firebase.js

  1. export const app = initializeApp(firebaseConfig);
  2. export const auth = getAuth(app);
  3. export const storage = getStorage(app);
  4. export const db = getFirestore(app);

huangapple
  • 本文由 发表于 2023年3月9日 23:07:51
  • 转载请务必保留本文链接：https://go.coder-hub.com/75686455.html
  • firebase
  • import
  • reactjs
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定