Quasar and vuefire

  • I would like to use firebase and vuefire in my project.
    But for some reason, i can’t find a way to do the setup right.
    I made a bootfile like this

    import firebase from 'firebase/app'
    import 'firebase/firestore'
    import 'firebase/auth'
    import Vue from 'vue'
    import {
    } from 'vuefire'
    var firebaseConfig = {
    // Initialize Firebase
    let firebaseApp = firebase.initializeApp(firebaseConfig);
    let firebaseAuth = firebaseApp.auth()
    const db = firebaseApp.firestore()
    export {

    In the index.vue i’ve put, just for test purpose

        <q-btn @click="loggen">Log all data</q-btn>
    import { db } from "boot/firebase";
    export default {
      name: "PageIndex",
      methods: {
        loggen() {
          console.log("fblog", this.test);
      firestore: {
        test: db.collection("TestCollectie")

    But this gives me an error like
    boot_firebase__WEBPACK_IMPORTED_MODULE_0__.db.collection is not a function

    Is there someone who can point me in the right direction? What am i doing wrong?
    Or does anyone has a demo-repo with quasar and vuefire where i can find an answer?

    Any help is appreciated!

  • Hi, I’m using Vuexfire successfully in my project as I’m using it to maintain a Vuex state rather than on an individual component.

    Let me know if you’d like to see that set up.

  • @jrhopkins83
    Hi i’m interested in your setup for vuexfire.
    Could you show it?

  • me too, thanks.

  • @pd76

    Here’s an article about Quasar Firebase and Vuexfire:

    Here’s the repo of a demo app( from the article):

Log in to reply