CODEWITHSUNDEEP
javascriptfirebasefirebase-realtime-databasefirebase-authentication
Relaxing Music
Relaxing Music

Reputation: 472

Firebase initialization returning "Uncaught ReferenceError: firebase is not defined"

I have the following setup:

<button type="button" name="button" class="btn btn-danger" onclick="signIn()">
  <i class="fa fa-google"></i> &nbsp;Login With Google
</button>
<script src="js/firebase.js" type="module"></script>
<script src="js/custom.js"></script>

firebase.js

// FIREBASE INITIALIZATION
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.3.0/firebase-app.js";
import { getAnalytics } from "https://www.gstatic.com/firebasejs/9.3.0/firebase-analytics.js";
const firebaseConfig = {
  apiKey: "XXXXXXXX",
  authDomain: "fir-chat-application-3e442.firebaseapp.com",
  projectId: "fir-chat-application-3e442",
  storageBucket: "fir-chat-application-3e442.appspot.com",
  messagingSenderId: "264006913204",
  appId: "XXXXXXXX",
  measurementId: "XXXXXXXX"
};
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);

custom.js

function signIn(){
  var provider = new firebase.auth.GoogleAuthProvider();
}

When I click on the Login With Google button I am getting the following error in the console:

Uncaught ReferenceError: firebase is not defined

I checked everything again and again but I don't seem to catch the error. What mistake am I making here?

Upvotes: 0

Views: 151

Answers (1)

Tonio
Tonio

Reputation: 1782

You're mixing api v8 and v9.

import { GoogleAuthProvider } from "https://www.gstatic.com/firebasejs/9.3.0/firebase-auth.js"

const provider = new GoogleAuthProvider();

Edit to demostrate that firebase scripts includes GoogleAuthProvider: 

<script type="module">

import { GoogleAuthProvider } from "https://www.gstatic.com/firebasejs/9.3.0/firebase-auth.js"

console.info(GoogleAuthProvider)
</script>

Upvotes: 1

Related Questions