'Firebase Database Errors

I am trying to make a basic firebase database app and continue to get 3 errors that I don't know how to fix. The errors are:

Uncaught SyntaxError: Unexpected token 'export' (at firebase-app.js:2348:1)
Uncaught SyntaxError: Cannot use import statement outside a module (at firebase-storage.js:1:1)
storage.js:16 Uncaught ReferenceError: firebase is not defined at storage.js:16:2 () at storage.js:58:2

For #3 storage.js:16:2 points to firebase.initializeApp(firebaseConfig) code and storage.js:16:2 point to the } at the end of the code, }());. I have attached my code and images of the errors I am getting. Please help!

(function(){
    
    // Your web app's Firebase configuration
    // For Firebase JS SDK v7.20.0 and later, measurementId is optional
    var firebaseConfig = {
        apiKey: "AIzaSyBFZQE-zC4QNu3ooZE7VygTN83g7su-wIc",
        authDomain: "courso-43b7d.firebaseapp.com",
        databaseURL: "https://courso-43b7d.firebaseio.com",
        projectId: "courso-43b7d",
        storageBucket: "courso-43b7d.appspot.com",
        messagingSenderId: "373899831879",
        appId: "1:373899831879:web:d76aa2fbd69529cabb9f62"
      };
  
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);


    // handle on firebase db
    var db = firebase.database();

    // get elements
    var message = document.getElementById('message');
    var write   = document.getElementById('write');
    var read      = document.getElementById('read');
    var status  = document.getElementById('status');

    // write
    write.addEventListener('click', e => {
        var messages = db.ref('messages');

        // simple id - ok for example, do not use in production
        var id = (new Date).getTime(); 

        // write to db
        messages.child(id).set({'message' : message.value})
            .then(function(){
                status.innerHTML = "Wrote to DB!";
            });
    });

    // read
    read.addEventListener('click', e => {
        status.innerHTML = '';
        var messages = db.ref('messages');

        messages.once('value')
          .then(function(dataSnapshot) {
            var data = dataSnapshot.val();
            var keys = Object.keys(data);

            keys.forEach(function(key){
                console.log(data[key]);
                status.innerHTML += JSON.stringify(data[key]) + '<br>';
            });
        });
    });


}());

<!DOCTYPE html>
<html>
<head>
    <!-- The core Firebase JS SDK is always required and must be listed first -->
    <script src="https://www.gstatic.com/firebasejs/9.8.0/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/9.8.0/firebase-database.js"></script>
</head>

<input id="message" type="text" placeholder="Text to write to DB"><br>
<button id="write">Write</button>
<button id="read">Read</button><br>
<div id="status"></div>
<script src="database.js"></script>

</html>

Dev Tools SyntaxErrors

javascript firebase

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'Firebase Database Errors

Sources

Related Questions