Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

vuefire

vuejs62.9kMIT3.2.1TypeScript support: included

Official Firebase bindings for Vue.js

vue, firebase, vuefire, vuexfire, vuex, composition, api

readme

VueFire logo


npm package build status


Firebase for Vue made easy!

  • Works with Vue >=2.7 and Vue 3
  • Supports Composition and Options API
  • Supports Vuex, Pinia, and anything that gives you a Vue ref()
  • Built for Modular Firebase >=9 for optimal tree shaking
  • Automatically listen for changes in nested references

📚 Documentation

Help me keep working on this project 💚

Silver Sponsors

<picture> <source srcset="https://posva-sponsors.pages.dev/logos/route4me.png" media="(prefers-color-scheme: dark)" height="42px" alt="Route Optimizer and Route Planner Software" /> Route Optimizer and Route Planner Software </picture> <picture> <source srcset="https://posva-sponsors.pages.dev/logos/prefectlogo-dark.svg" media="(prefers-color-scheme: dark)" height="42px" alt="Prefect" /> Prefect </picture> <picture> <source srcset="https://posva-sponsors.pages.dev/logos/vuemastery-dark.png" media="(prefers-color-scheme: dark)" height="42px" alt="VueMastery" /> VueMastery </picture>

Bronze Sponsors

<picture> <source srcset="https://posva-sponsors.pages.dev/logos/storyblok.png" media="(prefers-color-scheme: dark)" height="26px" alt="Storyblok" /> Storyblok </picture> <picture> <source srcset="https://posva-sponsors.pages.dev/logos/nuxt-dark.svg" media="(prefers-color-scheme: dark)" height="26px" alt="Nuxt UI Pro Templates" /> Nuxt UI Pro Templates </picture> <picture> <source srcset="https://avatars.githubusercontent.com/u/4183726?u=6b50a8ea16de29d2982f43c5640b1db9299ebcd1&v=4" media="(prefers-color-scheme: dark)" height="26px" alt="Antony Konstantinidis" /> Antony Konstantinidis </picture> <picture> <source srcset="https://avatars.githubusercontent.com/u/2486424?u=7b0c73ae5d090ce53bf59473094e9606fe082c59&v=4" media="(prefers-color-scheme: dark)" height="26px" alt="Stanislas Ormières" /> Stanislas Ormières </picture>

Status

  • VueFire and Nuxt VueFire are both currently stable

Roadmap

You can follow the progress and future plans on the Roadmap issue.

Installation

VueFire requires the firebase package to be installed as well as vuefire:

npm install vuefire firebase

Check the documentation for Nuxt instructions.

Usage

License

MIT

changelog

All CHANGELOG.md files have been move to their respective package folders. This file is no longer being automatically updated

Vuefire 2.0.1 Vuexfire 3.0.1 (2019-05-25)

Bug Fixes

Vuefire 2.0.0 Vuexfire 3.0.0 (2019-05-25)

🎉 Stable Release

After more than one year on alpha, Vuefire and Vuexfire are being released as stable releases. From this point on, no breaking changes will be made

If you are upgrading from vuefire@^1.0.0, please check the Migration guide If you are upgrading from vuexfire@^2.0.0, please check the Migration guide

This release doesn't add anything new compared to the latest alpha release

Vuefire 2.0.0-alpha.24 Vuexfire 3.0.0-alpha.18 (2019-05-10)

Bug Fixes

  • ensure objects in beforeCreate (cd5046b), closes #274
  • pass a default options to bind* (75c3e73)

Features

  • vuefire: add reset option
  • vuexfire: add reset option

BREAKING CHANGES

  • vuefire/vuexfire: When unbinding, the data is now, by default reset to null for items bound as objects, and to an empty array [] for items bound as an array. This option option can be set to false to keep the last value instead of resetting it, or to a function returning a value to customize the new value. More about it in the documentation

Vuefire 2.0.0-alpha.21 Vuexfire 3.0.0-alpha.15 (2019-03-22)

Features

  • vuexfire: add RTDB support (b7203b7)
  • vuexfire: rename exports (02c1020)
  • vuexfire: rename injected functions (e2f2a51)

BREAKING CHANGES

  • vuexfire: Renamed firebaseAction to firestoreAction as well as the two added function bindFirebaseRef and unbindFirebaseRef to bindFirestoreRef and unbindFirestoreRef. This is to enable using both RTDB and Cloud Firestore
  • vuexfire: Rename bindFirebaseRef to bindFirestoreRef and unbindFirebaseRef to unbindFirestoreRef to allow using them for RTDB
  • vuexfire: Rename firebaseMutations into vuexfireMutations. Rename firebaseAction into firestoreAction since we want to allow using RTDB as well and that name will be used for the firebaseAction as well
  • vuefire: the default export is replaced by a named export to make it clearer what you are importing from vuefire: Cloud Firestore or RTDB. Replace import Vuefire from 'vuefire' by import { firestorePlugin } from 'vuefire' and update the plugin installation: Vue.use(firestorePlugin)