Search code examples
javascriptnode.jsfirebasecloud9-ide

error 'Firebase is not defined' in online IDE


I'm trying to follow the Web Quickstart on Firebase found here but I get stuck on step 2.

I set up a new webpage on Cloud9, using the HTML5 template, with following basic content:

<html>
    <head>

    </head>
    <body>
        "Hallo"

        <script src="https://cdn.firebase.com/js/client/2.4.0/firebase.js">
            var myFirebaseRef = new Firebase('https://luminous-fire-8659.firebaseio.com/');
            myFirebaseRef.set({
              title: "Hello World!",
              author: "Firebase",
              location: {
                city: "San Francisco",
                state: "California",
                zip: 94103
              }
            });
        </script>
    </body>
</html>

If I don't add the line var Firebase = require("firebase"); I get error

'Firebase is not defined'.

If I add the line I get the error:

'uncaught reference error: require is not defined.

I also tried to use a nodeJS template and then run command $ npm install firebase --save in the terminal. Result shows in terminal:

firebase@2.4.0 node_modules/firebase
└── faye-websocket@0.9.3 (websocket-driver@0.5.2)

(so installing firebase seems to work) and then add this page of code but that doesn't make a difference.

Security rules are set to default:

{
    "rules": {
        ".read": true,
        ".write": true
    }
}

How to solve this issue? I do not have the option to install nodeJS locally (working on schoolcomputer).


Solution

  • require() doesn't exist within the browser - it's specific to the Node.js runtime, not part of JavaScript itself. You can't use NPM modules in the browser without using extra bundling tools, like Webpack.

    That said, the code in your original example isn't far from working - you just need to put the src="https://cdn.firebase.com/js/client/2.4.0/firebase.js" on a separate script tag, before than the one that contains your code. But to be clear, that is just plain JavaScript, rather than Node.js - if you're trying to write Node code in a HTML document, you're misunderstanding what Node actually is!