javascript - Getting "TypeError: Cannot read property 'arrayUnion' of undefined" when trying to update an array in firestore

Question

I'm receiving the following error message when trying to update an array in cloud firestore:

TypeError: Cannot read property 'arrayUnion' of undefined

Here is my code along with my firebase config:

import fire from '../config/Firebase';
  
let tweetToUpdate = 'example-value';

fire.firestore().collection("liked-tweets")
  .doc(userID)
  .update({
    tweets: fire.firestore.FieldValue.arrayUnion(tweetToUpdate),
    });

Firebase.js

import firebase from "firebase";

const CONFIG = {
  apiKey: "",
  authDomain: "twitter-clone-c1b85.firebaseapp.com",
  projectId: "twitter-clone-c1b85",
  storageBucket: "twitter-clone-c1b85.appspot.com",
  messagingSenderId: "987719332990",
  appId: "1:987719332990:web:2fde4fb30d70bcf0bb542f",
  measurementId: "G-T347VWPPJM",
};

const fire = firebase.initializeApp(CONFIG);

export default fire;

Going by the error message, it would suggest the 'fire.firestore' object is undefined and therefore does not have a property named 'FieldValue'. However, should my 'fire' not have a 'firestore' object?

Other methods like fire.firestore(), fire.storage() work fine.

I suspect it has something to do with how I'm exporting/importing firebase but I cannot figure out where I'm going wrong.

I've tried some related SO threads e.g Firestore arrayUnion but have not found an answer that works.

Here are the docs I've been following: Update elements in an array

Any help would be greatly appreciated!! Thanks.

Answer 1

So I managed to get it working by importing the following:

import firebase from 'firebase/app'

Thanks to the following SO thread

Seems when you want to access the 'firestore' object you need to import from 'firebase/app'.