"TypeError: db._checkNotDeleted is not a function" When creating a Storage Ref on Firebase / React

I'm creating an app on React that uses Firebase for backend data and want to be able to upload pictures. When trying to get a Storage Ref through firebase, I get the following error:

Every time I try to get a ref to the Storage, I get this error. I also use the realtime-databse on firebase, but I don't think that would interfere at all. Below is the code that is called:

import database, { auth, provider, storage } from '../../components/utils/firebase.js'; import { uploadBytes } from '@firebase/storage'; ... handleSubmit(e) { e.preventDefault(); const file = e.target[0].files[0]; console.log("File: ", file); if (!file) { console.log("No file!"); } else { const storageRef = ref(storage, `images/${file.name}`); uploadBytes(storageRef, file); console.log("Uploaded file!"); console.log("File: " + file); } } 

firebase.js (my config file):

import { initializeApp } from 'firebase/app'; import { getDatabase } from 'firebase/database'; import { getAuth, GoogleAuthProvider } from 'firebase/auth'; import { getStorage } from 'firebase/storage'; const firebaseConfig = { apiKey: process.env.REACT_APP_APIKEY, authDomain: process.env.REACT_APP_AUTHDOMAIN, databaseURL: process.env.REACT_APP_DATABASEURL, projectId: process.env.REACT_APP_PROJECTID, storageBucket: process.env.REACT_APP_STORAGEBUCKET, messagingSenderId: process.env.REACT_APP_MESSAGINGSENDERID, appId: process.env.REACT_APP_APPID, measurementId: process.env.REACT_APP_MEASUREMENTID }; // Initialize Firebase const app = initializeApp(firebaseConfig); const database = getDatabase(app); export const storage = getStorage(app); export default database; export const auth = getAuth(app); export const provider = new GoogleAuthProvider(); 

Does anyone have any ideas as to why this is happening? Thank you!

1 Answer

I found the issue while watching a video of someone setting up their storage bucket.

Essentially, because I am already using ref for my realtime database, and import that command from the realtime database folder, my storage ref was actually a realtime database ref. To fix this, I imported my storage ref function like so:

import { ref as sRef } from 'firebase/storage';

then used sRef instead of ref.

Hope this helps anyone who had the same issue! It was frustrating to hunt down