Connie
Connie

Reputation: 3

Firebase initialization error in VueJS Project

first time posting here. Also quite new to VueJS, know some Angular.

I ran into an error when initializing Firebase(first time getting this error) in my VueJS project:

https://i.sstatic.net/K38oJ.png

That showed up briefly after click event, so I had to slow down my network to take screenshot.

And created 2 files: firebaseInit.js and firebaseConfig.js(which contains the api key, etc for web app):

In firebaseInit.js:

import firebase from 'firebase';
import 'firebase/firestore';
import firebaseConfig from './firebaseConfig';

const firebaseApp= 
firebase.initializeApp(firebaseConfig);

export default firebaseApp.firestore();

and put:

export default { the config key value pairs obtained 
from Firebase console } 

in firebaseConfig.js.

Extra info(though I don't think this is the source of the problem):

I imported firebase with import firebase as 'firebase' in the vue file I used firebase auth() and createUserWithEmailandPassword() in the methods property, but alert() doesn't work.

import firebase from 'firebase';

export default {
  name: 'register',
  data: function() {
    return {
      email: '',
      password: ''
    };
  },
  methods: {
    register: function(e) {
      firebase
        .auth()
        .createUserWithEmailAndPassword(this.email, this.password)
        .then(
          user => {
            alert(`Account made for ${user.email}`);
            this.$router.push('/');
          },
          err => {
            console.log(err.message);
          }
        );

      e.preventDefault();
    }
  }
};

Upvotes: 0

Views: 764

Answers (1)

TommyF
TommyF

Reputation: 7150

You created your firebaseInit.js but since you never import or require it, is it never executed, thus resulting in a "firebase not initialized" error when you try to use the firebase you imported from the generic firebase module instead.

Use export default firebaseApp in your firebaseInit.js (and not firestore as you do now) and then import firebase from 'path/to/firebaseInit.js' for example.

Upvotes: 1

Related Questions