ReferenceError: Can't find variable: firebase global code

Question

我不断收到错误：ReferenceError:

找不到变量：firebase global code@/script.js:10:26 at /script.js:10:26

我正确地初始化了它，但是当我引用变量时它抛出了一个错误。就初始化变量而言，我的代码看起来是正确的，但这是我的代码（我已经包含了我的 html 文件和我的 javascript 文件）。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>repl.it</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
  </head>

  <label>User ID:</label><br>
  <input type="text" id="userId" /><br>

  <label>First Name:</label><br>
  <input type="text" id="firstName" /><br>

  <label>Last Name:</label><br>
  <input type="text" id="lastName" /><br>

  <label>Age:</label><br>
  <input type="text" id="age" /><br>

  <button id="addBtn">ADD</button>
  <button id="updateBtn">UPDATE</button>
  <button id="readBtn">READ</button><br>
  <button id="removeBtn">REMOVE</button>


  <body>
    <script src="script.js"></script>
  </body>

  <!-- The core Firebase JS SDK is always required and must be listed first -->
<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/8.0.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.0.1/firebase-firestore.js"></script>
<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="https://www.gstatic.com/firebasejs/8.0.1/firebase-analytics.js"></script>

<script>
  // Your web app's Firebase configuration
  // For Firebase JS SDK v7.20.0 and later, measurementId is optional
  var firebaseConfig = {
    apiKey: "AIzaSyBRhn_MY7TNnTDPbf2WXU-5bio6zpd70UI",
    authDomain: "myawesomeproject-69436.firebaseapp.com",
    databaseURL: "https://myawesomeproject-69436.firebaseio.com",
    projectId: "myawesomeproject-69436",
    storageBucket: "myawesomeproject-69436.appspot.com",
    messagingSenderId: "299772211749",
    appId: "1:299772211749:web:b503b7a4fb44a8676f05cc",
    measurementId: "G-6MH270KGNL"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
</script>
</html>

const database = firebase.firestore();
const usersCollection = database.collection('users');

addBtn.addEventListener('click', e => {
  e.preventDefault();
  const ID = usersCollection.doc();

  ID.set({
    first_name: firstName.value,
    last_name: lastName.value,
    age: age.value
  })

  .then(() => {console.log("data written");})
  
});

Answer 1

您的 script.js 脚本包含必须在 firebase SDK 脚本之后，因此它们可以使用全局 firebase 变量。所以，把它移到:

之后

<script src="https://www.gstatic.com/firebasejs/8.0.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.0.1/firebase-firestore.js"></script>
<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="https://www.gstatic.com/firebasejs/8.0.1/firebase-analytics.js"></script>
<script>
// code that includes firebase.initializeApp()
</script>
<script src="script.js"></script>

ReferenceError: Can't find variable: firebase global code

ReferenceError: Can't find variable: firebase global code

html

javascript

reference

firebase

firebase-realtime-database