vuefire

Variables

• devalueCustomParsers
• devalueCustomStringifiers
• firestoreDefaultConverter
• globalDatabaseOptions
• globalFirestoreOptions
• useList
• useObject
• useStorage
• useStorageMetadata
• useStorageObject
• useStorageUrl

Functions

• databaseDefaultSerializer()
• databasePlugin()
• firestorePlugin()
• getCurrentUser()
• rtdbPlugin()
• updateCurrentUserProfile()
• useAppCheck()
• useAppCheckToken()
• useCollection()
• useCurrentUser()
• useDatabase()
• useDatabaseList()
• useDatabaseObject()
• useDocument()
• useFirebaseApp()
• useFirebaseAuth()
• useFirebaseStorage()
• useFirestore()
• useIsCurrentUserLoaded()
• usePendingPromises()
• useSSRInitialState()
• useStorageFile()
• useStorageFileMetadata()
• useStorageFileUrl()
• VueFire()
• VueFireAppCheck()
• VueFireAuth()
• VueFireAuthOptionsFromAuth()
• VueFireAuthWithDependencies()
• VueFireDatabaseOptionsAPI()
• VueFireFirestoreOptionsAPI()

Interfaces

• DatabasePluginOptions

  • bindName
  • unbindName
• DatabaseSnapshotSerializer
• FirestorePluginOptions

  • bindName
  • unbindName
• UseCollectionOptions
• UseDatabaseRefOptions
• UseDocumentOptions
• VueFireAppCheckOptions

  • debug
• VueFireAuthOptions

  • dependencies
  • initialUser
• VueFireAuthOptionsFromAuth

  • auth
• VueFireModule
• VueFireOptions

  • firebaseApp
  • modules

Type Aliases

• FirebaseOption
• FirestoreOption
• UseListOptions
• UseObjectOptions
• VueDatabaseDocumentData
• VueDatabaseQueryData
• VueFirebaseObject
• VueFirestoreDocumentData
• VueFirestoreObject
• VueFirestoreQueryData

variable devalueCustomParsers

const devalueCustomParsers: {
    TimeStamp: (data: ReturnType<Timestamp['toJSON']>) => Timestamp;
    GeoPoint: (data: ReturnType<GeoPoint['toJSON']>) => GeoPoint;
};

• Custom parsers for [devalue](https://github.com/Rich-Harris/devalue) to support Firestore Timestamp and GeoPoint on SSR.

variable devalueCustomStringifiers

const devalueCustomStringifiers: {
    TimeStamp: (data: unknown) => false | { seconds: number; nanoseconds: number };
    GeoPoint: (data: unknown) => false | { latitude: number; longitude: number };
};

• Custom stringifier for [devalue](https://github.com/Rich-Harris/devalue) to support Firestore Timestamp and GeoPoint on SSR.

variable firestoreDefaultConverter

const firestoreDefaultConverter: FirestoreDataConverter<any>;

• Default converter for Firestore data. Can be overridden globally by setting globalFirestoreOptions.converter.

variable globalDatabaseOptions

const globalDatabaseOptions: _DatabaseRefOptionsWithDefaults;

variable globalFirestoreOptions

const globalFirestoreOptions: _FirestoreRefOptionsWithDefaults;

• Global default options

variable useList

const useList: <T = unknown>(
    reference: MaybeRefOrGetter<any>,
    options?: UseListOptions<T>
) => _RefDatabase<VueDatabaseQueryData<T>>;

• Deprecated

  use useDatabaseList() instead

variable useObject

const useObject: <T = unknown>(
    reference: MaybeRefOrGetter<DatabaseReference>,
    options?: UseObjectOptions<T>
) => _RefDatabase<T & { readonly id: string }>;

• Deprecated

  use useDatabaseObject() instead

variable useStorage

const useStorage: (name?: string) => firebase_storage.FirebaseStorage;

• Deprecated

  use useFirebaseStorage() instead

variable useStorageMetadata

const useStorageMetadata: (storageRef: MaybeRefOrGetter<StorageReference>) => {
    metadata: vue_demi.ShallowRef<any, any>;
    update: (newMetadata: SettableMetadata) => Promise<any>;
    refresh: () => Promise<any>;
    promise: vue_demi.ShallowRef<Promise<any>, Promise<any>>;
};

• Deprecated

  use useStorageFileMetadata() instead

variable useStorageObject

const useStorageObject: (storageRef: MaybeRefOrGetter<StorageReference>) => {
    url: vue_demi.Ref<string, string>;
    metadata: vue_demi.ShallowRef<any, any>;
    snapshot: vue_demi.ShallowRef<any, any>;
    uploadTask: vue_demi.ShallowRef<any, any>;
    uploadError: vue_demi.ShallowRef<any, any>;
    uploadProgress: vue_demi.ComputedRef<number>;
    upload: (
        newData: Blob | Uint8Array | ArrayBuffer,
        newMetadata?: UploadMetadata
    ) => Promise<unknown>;
    updateMetadata: (newMetadata: SettableMetadata) => Promise<any>;
    refresh: () => Promise<[string, any]>;
};

• Deprecated

  use useStorageFile() instead

variable useStorageUrl

const useStorageUrl: (storageRef: MaybeRefOrGetter<StorageReference>) => {
    url: vue_demi.Ref<string, string>;
    refresh: () => Promise<string>;
    promise: vue_demi.ShallowRef<Promise<string>, Promise<string>>;
};

• Deprecated

  use useStorageFileUrl() instead

function databaseDefaultSerializer

databaseDefaultSerializer: (
    snapshot: DataSnapshot
) => VueDatabaseDocumentData<unknown>;

• Convert firebase Database snapshot of a ref **that exists** into a bindable data record.

  Parameter snapshot

function databasePlugin

databasePlugin: (
    app: App,
    pluginOptions?: DatabasePluginOptions,
    firebaseApp?: FirebaseApp
) => void;

• Install this plugin if you want to add $databaseBind and $databaseUnbind functions. Note this plugin is only necessary if you use the Options API. If you **exclusively use the Composition API** (e.g. useDatabaseObject() and useDatabaseList()), you should not add it.

  Parameter app

  Parameter pluginOptions

  Deprecated

  Use VueFire and VueFireDatabaseOptionsAPI with the modules option instead.

function firestorePlugin

firestorePlugin: (
    app: App,
    pluginOptions?: FirestorePluginOptions,
    firebaseApp?: FirebaseApp
) => void;

• Install this plugin to add $firestoreBind and $firestoreUnbind functions. Note this plugin is not necessary if you exclusively use the Composition API (useDocument() and useCollection()).

  Parameter app

  Parameter pluginOptions

  Deprecated

  Use VueFire and VueFireFirestoreOptionsAPI with the modules option instead.b

function getCurrentUser

getCurrentUser: (name?: string) => Promise<_Nullable<User>>;

• Returns a promise that resolves the current user once the user is loaded. Must be called after the firebase app is initialized.

  Parameter name

  name of the firebase application

function rtdbPlugin

rtdbPlugin: (
    app: App,
    pluginOptions?: DatabasePluginOptions,
    firebaseApp?: FirebaseApp
) => void;

• Install this plugin if you want to add $databaseBind and $databaseUnbind functions. Note this plugin is only necessary if you use the Options API. If you **exclusively use the Composition API** (e.g. useDatabaseObject() and useDatabaseList()), you should not add it.

  Parameter app

  Parameter pluginOptions

  Deprecated

  Use VueFire and VueFireDatabaseOptionsAPI with the modules option instead.

function updateCurrentUserProfile

updateCurrentUserProfile: (profile: {
    displayName?: _Nullable<string>;
    photoURL?: _Nullable<string>;
}) => Promise<void>;

• Updates the current user profile and updates the current user state. This function internally calls updateProfile() from 'firebase/auth' and then updates the current user state.

  Parameter profile

  the new profile information

function useAppCheck

useAppCheck: (name?: string) => AppCheck;

• Retrieves the Firebase App Check instance.

  Parameter name

  name of the application

function useAppCheckToken

useAppCheckToken: () => Ref<string, string>;

• The current app-check token as a Ref. Note this ref is always undefined on the server.

function useCollection

useCollection: {
    <R extends unknown>(
        collectionRef: MaybeRefOrGetter<R>,
        options?: UseCollectionOptions<_InferReferenceType<R>[]>
    ): _RefFirestore<_InferReferenceType<R>[]>;
    <T>(
        collectionRef: MaybeRefOrGetter<any>,
        options?: UseCollectionOptions<T[]>
    ): _RefFirestore<VueFirestoreQueryData<T>>;
};

• Creates a reactive collection (usually an array) of documents from a collection ref or a query from Firestore. Extracts the type of the query or converter.

  Parameter collectionRef

  query or collection

  Parameter options

  optional options

• Creates a reactive collection (usually an array) of documents from a collection ref or a query from Firestore. Accepts a generic to **enforce the type** of the returned Ref. Note you can (and probably should) use .withConverter() to have stricter type safe version of a collection reference.

  Parameter collectionRef

  query or collection

  Parameter options

  optional options

function useCurrentUser

useCurrentUser: (name?: string) => Ref<User, User>;

• Returns a reactive variable of the currently authenticated user in the firebase app. The ref is null if no user is authenticated or when the user logs out. The ref is undefined until the user is initially loaded.

  Parameter name

  name of the application

function useDatabase

useDatabase: (name?: string) => firebase_database.Database;

• Retrieves the Database instance.

  Parameter name

  name of the application

  Returns

  the Database instance

function useDatabaseList

useDatabaseList: <T = unknown>(
    reference: MaybeRefOrGetter<any>,
    options?: UseListOptions<T>
) => _RefDatabase<VueDatabaseQueryData<T>>;

• Creates a reactive variable connected to the database as an array. Each element in the array will contain an id property. Note that if you override the serialize option, it should **also set an id property** in order for this to work.

  Parameter reference

  Reference or query to the database

  Parameter options

  optional options

function useDatabaseObject

useDatabaseObject: <T = unknown>(
    reference: MaybeRefOrGetter<DatabaseReference>,
    options?: UseObjectOptions<T>
) => _RefDatabase<VueDatabaseDocumentData<T> | undefined>;

• Creates a reactive variable connected to the database as an object. If the reference is a primitive, it will be converted to an object containing a $value property with the primitive value and an id property with the reference's key.

  Parameter reference

  Reference or query to the database

  Parameter options

  optional options

function useDocument

useDocument: {
    <R extends DocumentReference<unknown>>(
        documentRef: MaybeRefOrGetter<R>,
        options?: UseDocumentOptions<_InferReferenceType<R>>
    ): _RefFirestore<_InferReferenceType<R> | undefined>;
    <T>(
        documentRef: MaybeRefOrGetter<DocumentReference>,
        options?: UseDocumentOptions<T>
    ): _RefFirestore<T & { readonly id: string }>;
};

• Creates a reactive document from a document ref from Firestore. Automatically extracts the type of the converter or the document.

  Parameter documentRef

  document reference

  Parameter options

  optional options

• Creates a reactive collection (usually an array) of documents from a collection ref or a query from Firestore. Accepts a generic to **enforce the type** of the returned Ref. Note you can (and probably should) use .withConverter() to have stricter type safe version of a collection reference.

  Parameter documentRef

  query or collection

  Parameter options

  optional options

function useFirebaseApp

useFirebaseApp: (name?: string) => FirebaseApp;

• Gets the firebase app instance.

  Parameter name

  optional firebase app name

  Returns

  the firebase app

function useFirebaseAuth

useFirebaseAuth: () => Auth | null;

• Retrieves the Firebase Auth instance. **Returns null on the server**. When using this function on the client in TypeScript, you can force the type with useFirebaseAuth()!.

  Returns

  the Auth instance

function useFirebaseStorage

useFirebaseStorage: (name?: string) => firebase_storage.FirebaseStorage;

• Retrieves the Storage instance.

  Parameter name

  name of the application

  Returns

  the Database instance

function useFirestore

useFirestore: (name?: string) => firebase_firestore.Firestore;

• Retrieves the Firestore instance.

  Parameter name

  name of the application

  Returns

  the Firestore instance

function useIsCurrentUserLoaded

useIsCurrentUserLoaded: (name?: string) => vue_demi.ComputedRef<boolean>;

• Helper that returns a computed boolean that becomes true as soon as the current user is no longer undefined. Note this doesn't ensure the user is logged in, only if the initial signing process has run.

  Parameter name

  name of the application

function usePendingPromises

usePendingPromises: (
    app?: FirebaseApp
) => Promise<(readonly [string, unknown])[]>;

• Allows awaiting for all pending data sources. Useful to wait for SSR

  Parameter app

  the firebase app

  Returns

  - a Promise that resolves with an array of all the resolved pending promises

function useSSRInitialState

useSSRInitialState: (
    initialState: SSRStore | undefined,
    firebaseApp: FirebaseApp
) => SSRStore;

• Allows getting the initial state set during SSR on the client.

  Parameter initialState

  the initial state to set for the firebase app during SSR. Pass undefined to not set it

  Parameter firebaseApp

  the firebase app to get the initial state for

  Returns

  the initial states for the current firebaseApp

function useStorageFile

useStorageFile: (storageRef: MaybeRefOrGetter<StorageReference>) => {
    url: vue_demi.Ref<string, string>;
    metadata: vue_demi.ShallowRef<any, any>;
    snapshot: vue_demi.ShallowRef<any, any>;
    uploadTask: vue_demi.ShallowRef<any, any>;
    uploadError: vue_demi.ShallowRef<any, any>;
    uploadProgress: vue_demi.ComputedRef<number>;
    upload: (
        newData: Blob | Uint8Array | ArrayBuffer,
        newMetadata?: UploadMetadata
    ) => Promise<unknown> | undefined;
    updateMetadata: (newMetadata: SettableMetadata) => Promise<FullMetadata | null>;
    refresh: () => Promise<[string | null, FullMetadata | null]>;
};

• Reactive information (url, metadata) of a StorageReference. Allows updating and deleting the storage object.

  Parameter storageRef

  StorageReference

function useStorageFileMetadata

useStorageFileMetadata: (storageRef: MaybeRefOrGetter<StorageReference>) => {
    metadata: vue_demi.ShallowRef<any, any>;
    update: (newMetadata: SettableMetadata) => Promise<FullMetadata | null>;
    refresh: () => Promise<FullMetadata | null>;
    promise: vue_demi.ShallowRef<Promise<any>, Promise<any>>;
};

• Returns a reactive version of the metadata of a StorageReference. Updates automatically if the StorageReference changes.

  Parameter storageRef

  StorageReference

function useStorageFileUrl

useStorageFileUrl: (storageRef: MaybeRefOrGetter<StorageReference>) => {
    url: vue_demi.Ref<string | null | undefined, string | null | undefined>;
    refresh: () => Promise<string | null>;
    promise: vue_demi.ShallowRef<Promise<string | null>, Promise<string | null>>;
};

• Retrieves a reactive download URL of a StorageReference. Updates automatically if the StorageReference changes.

  Parameter storageRef

  StorageReference

function VueFire

VueFire: (app: App, { firebaseApp, modules }: VueFireOptions) => void;

• VueFire Vue plugin.

function VueFireAppCheck

VueFireAppCheck: (
    options: VueFireAppCheckOptions
) => (firebaseApp: FirebaseApp, app: App) => void;

• VueFire AppCheck Module to be added to the VueFire Vue plugin options. This module **is client only** and shouldn't be added on server.

  Example 1

  import { createApp } from 'vue'
  import { VueFire, VueFireAppCheck } from 'vuefire'
  
  const app = createApp(App)
  app.use(VueFire, {
    modules: [VueFireAppCheck()],
  })

function VueFireAuth

VueFireAuth: (initialUser?: User) => VueFireModule;

• VueFire Auth Module to be added to the VueFire Vue plugin options. This calls the VueFireAuthWithDependencies() with **all** the dependencies, increasing bundle size. Consider using VueFireAuthWithDependencies() instead to better control the bundle size.

  Parameter initialUser

  initial value of the user. used for SSR

  Example 1

  import { createApp } from 'vue'
  import { VueFire, VueFireAuth } from 'vuefire'
  
  const app = createApp(App)
  app.use(VueFire, {
   modules: [VueFireAuth()],
  })

  See Also

  • https://firebase.google.com/docs/auth/web/custom-dependencies

function VueFireAuthOptionsFromAuth

VueFireAuthOptionsFromAuth: ({
    auth,
    initialUser,
}: VueFireAuthOptionsFromAuth) => VueFireModule;

• VueFire Auth Module to be added to the VueFire Vue plugin options. It accepts an auth instance rather than the dependencies. It allows manually calling emulators and other advanced use cases. Prefer using VueFireAuthWithDependencies() and VueFireAuth() for most use cases.

  Parameter options

  auth instance and initial user

function VueFireAuthWithDependencies

VueFireAuthWithDependencies: ({
    dependencies,
    initialUser,
}: VueFireAuthOptions) => VueFireModule;

• VueFire Auth Module to be added to the VueFire Vue plugin options. It accepts dependencies to pass to initializeAuth() to better control the bundle size.

  Parameter options

  user and options to pass to initializeAuth().

function VueFireDatabaseOptionsAPI

VueFireDatabaseOptionsAPI: (
    pluginOptions?: DatabasePluginOptions
) => (firebaseApp: FirebaseApp, app: App) => void;

• VueFire Database Module to be added to the VueFire Vue plugin options. If you **exclusively use the Composition API** (e.g. useDatabaseObject() and useDatabaseList()), you should not add it.

  Example 1

  import { createApp } from 'vue'
  import { VueFire, VueFireDatabaseOptionsAPI } from 'vuefire'
  
  const app = createApp(App)
  app.use(VueFire, {
    modules: [VueFireDatabaseOptionsAPI()],
  })

function VueFireFirestoreOptionsAPI

VueFireFirestoreOptionsAPI: (
    pluginOptions?: FirestorePluginOptions
) => (firebaseApp: FirebaseApp, app: App) => void;

• VueFire Firestore Module to be added to the VueFire Vue plugin options.

  Example 1

  import { createApp } from 'vue'
  import { VueFire, VueFireFirestoreOptionsAPI } from 'vuefire'
  
  const app = createApp(App)
  app.use(VueFire, {
    modules: [VueFireFirestoreOptionsAPI()],
  })

type FirebaseOption

type FirebaseOption = VueFirebaseObject | (() => VueFirebaseObject);

type FirestoreOption

type FirestoreOption = VueFirestoreObject | (() => VueFirestoreObject);

type UseListOptions

type UseListOptions<DataT = unknown> = UseDatabaseRefOptions<DataT>;

type UseObjectOptions

type UseObjectOptions<DataT = unknown> = UseDatabaseRefOptions<DataT>;

type VueDatabaseDocumentData

type VueDatabaseDocumentData<T = unknown> =
    | null
    | (T & {
          /**
           * id of the document
           */
          readonly id: string;
      });

• Type used by default by the serialize option.

type VueDatabaseQueryData

type VueDatabaseQueryData<T = unknown> = Array<
    _Simplify<NonNullable<VueDatabaseDocumentData<T>>>
>;

• Same as VueDatabaseDocumentData but for a query.

type VueFirebaseObject

type VueFirebaseObject = Record<string, Query | DatabaseReference>;

type VueFirestoreDocumentData

type VueFirestoreDocumentData<T = DocumentData> =
    | null
    | (T & {
          /**
           * id of the document
           */
          readonly id: string;
      });

• Type used by default by the firestoreDefaultConverter.

type VueFirestoreObject

type VueFirestoreObject = Record<string, _FirestoreDataSource>;

type VueFirestoreQueryData

type VueFirestoreQueryData<T = DocumentData> = Array<
    _Simplify<NonNullable<VueFirestoreDocumentData<T>>>
>;