Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

311
Views
export "firebase/storage" and "firebase/firestore" in one file - Nextjs

I have a problem when I want to export both objects of my firebase.js file I got this error:

TypeError: Cannot read properties of undefined (reading 'ref')

firebase.js

import firebase from "firebase";
import "firebase/storage";
import "firebase/firestore";

const firebaseConfig = {
  apiKey: ....
};
if (!firebase.apps.length) {
  firebase.initializeApp(firebaseConfig);
} else {
  firebase.app();
}
var storage = firebase.storage();
var firestore = firebase.firestore();

export default { storage, firestore };

upload.js

  import React, { useState } from "react";
  import { storage } from "../lib/firebase";

  function account() {
    const [image, setImage] = useState("");
    const upload = () => {
      if (image == null) return;
      storage
        .ref(`/images/${image.name}`)
        ....
    };

    return (
      <div>
        <Upload />
      </div>
    );
  }

  export default account;

If I export only the storage and import it in my upload.jsfile it works. What is the different?

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

if you to try import per module. It should be something like this.

firebase.js

import firebase from "firebase";
import "firebase/storage";
import "firebase/firestore";

const firebaseConfig = {
  apiKey: ....
};
if (!firebase.apps.length) {
  firebase.initializeApp(firebaseConfig);
} else {
  firebase.app();
}
var storage = firebase.storage();
var firestore = firebase.firestore();

export { storage, firestore };

upload.js

import React, { useState } from "react";
  import { storage, firestore } from "../lib/firebase";

  function account() {
    const [image, setImage] = useState("");
    const upload = () => {
      if (image == null) return;
      storage
        .ref(`/images/${image.name}`)
        ....
    };

    return (
      <div>
        <Upload />
      </div>
    );
  }

  export default account;

Hopefully can help you!

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!