7

Im trying to integrate a firebase config into my js file rather than directly into html file. Given:

<script src="https://www.gstatic.com/firebasejs/3.4.0/firebase.js"></script>
<script>
  // Initialize Firebase
  var config = {
  .......
  }
</script>

and my js file:

$(function() {
......
}

how can I integrate the line <script src="https://www.gstatic.com/firebasejs/3.4.0/firebase.js"></script> into my js file ?

Mike
  • 149
  • 1
  • 2
  • 8
  • This question has been answered here: http://stackoverflow.com/questions/950087/how-to-include-a-javascript-file-in-another-javascript-file – anakinquitpanakin Sep 24 '16 at 20:01
  • Good question. The solution is to * Download firebase.js file (to overcome script loading time) * Create a new javascript file and initialize firebase along with functionalities over here. * Add in the head of the html file. * Add in the head of the html file. – Zujaj Misbah Khan Feb 11 '19 at 11:35

2 Answers2

11

You can create a tag script and append to body of document.

var script = document.createElement('script');
    script.type = 'text/javascript';

    script.src = 'https://www.gstatic.com/firebasejs/3.4.0/firebase.js';
    document.body.appendChild(script);
cesare
  • 2,098
  • 19
  • 29
  • 1
    ReferenceError: document is not defined – Pygirl Feb 19 '20 at 14:47
  • 2
    @Pygirl -- this question is about loading an external script into a webpage, without adding a – ohsully Mar 03 '20 at 20:47
0

You need to use modular system to stop witting <script> tags for dependencies. Setup firebase from npm, use one of available ways to load module. There are following ways:

  • AMD (RequireJs as example) - import modules asynchronously with such constructions as require("firebase"), define(["firebase"], (firebaseDependency)=>{...});
  • CommonJs - approach which was derived from server side nodeJs;
  • ES6 (with babel): import firebase from "firebase";

In this case you'll need to allocate your config separately and import it too.

yavalvas
  • 330
  • 2
  • 17