firebase / firebaseui-web

FirebaseUI is an open-source JavaScript library for Web that provides simple, customizable UI bindings on top of Firebase SDKs to eliminate boilerplate code and promote best practices.

Home Page:https://firebase.google.com/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Uncaught ReferenceError: firebase is not defined

MrDark1545 opened this issue · comments

i am trying to connect and fetch data from my firebase firestore database but I am having error on
firebase.initializeApp(firebaseConfig);
error is Uncaught ReferenceError: firebase is not defined I tried may ways that were told on different websites ut nothing worked kindly help my code is

<script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>
<script src="https://www.gstatic.com/firebasejs/9.22.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.22.1/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.22.1/firebase-auth.js"></script>

<script src="https://code.jquery.com/jquery-3.7.0.js" ></script>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>  
<script type="text/javascript" src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> 


<script>
  // Firebase configuration
  var firebaseConfig = {
    // Your Firebase configuration here
          apiKey: "{{ config('services.firebase.apiKey') }}",
            authDomain: "{{ config('services.firebase.authDomain') }}",
            projectId: "{{ config('services.firebase.projectId') }}",
            storageBucket: "{{ config('services.firebase.storageBucket') }}",
            messagingSenderId: "{{ config('services.firebase.messagingSenderId') }}",
            appId: "{{ config('services.firebase.appId') }}",
            measurementId: "{{ config('services.firebase.measurementId') }}"
  };

  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);        //getting error on this line 

  // Your code that uses the 'firebase' object here
</script>

firebase.initializeApp(firebaseConfig);

Thanks for the question! It seems that you're using v9 of Firebase, which uses modular SDK by default, can you try using const app = initializeApp(firebaseConfig); instead of firebase.initializeApp(firebaseConfig); ? If the app requires the use of namespaced libraries, try import firebase from 'firebase/compat/app'; before calling firebase.initializeApp(firebaseConfig);. Hope this helps!

commented

@MrDark1545 it looks like you're using a very old version of the Firebase SDK (2.2.1) in combination with some newer Firebase modules (9.22.1). If you'd like to add Firebase from a CDN like you're doing, please follow the instructions here: https://firebase.google.com/docs/web/alt-setup.

thanks for your help @jhuleatt it worked