Image upload to Firebase storage failed on storage

Issue

My Angular app allows the user to upload an image to firebase CDN. This has worked up until the other day. After my last deployment which did not touch the image code, I get this error on the storage method:

firebase_app__WEBPACK_IMPORTED_MODULE_6__.storage is not a function

The code is here:

    import * as firebase from 'firebase/app';
    ...
    const storagePathname = `${storageLogos}${this.account.accountId}-${selectedImageFile.name}`;
    const logoStorageRef = firebase.storage().ref().child(storagePathname)
    await logoStorageRef.put(selectedImageFile).then(async snapshot => {
    ... do some other stuff ...
    }

Did something change on Firebase’s side that I did not catch?

Solution

Stupid…

As I was typing "did not change the image code" in the question, that nagging voice in my head said that’s the FIRST thing you’d check in someone else’s code. And of course, it was. This

import * as firebase from 'firebase';

was changed to this:

import * as firebase from 'firebase/app';

And sure enough, that was the problem!

Answered By – Love to Code

Answer Checked By – David Goodson (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.