วิธีอื่นในการเพิ่ม Firebase ให้กับโปรเจ็กต์ JavaScript ของคุณ

สำหรับเว็บแอป Firebase ส่วนใหญ่ เราขอแนะนำอย่างยิ่งให้ใช้ SDK ผ่าน npm อย่างไรก็ตาม สำหรับผู้ใช้ที่มีข้อกำหนดพิเศษ Firebase มี ตัวเลือกอื่นในการเพิ่ม SDK หน้านี้ให้คำแนะนำการตั้งค่าโดยละเอียดสำหรับวิธีอื่นเหล่านี้:

  • CDN (เครือข่ายการจัดส่งเนื้อหา)
  • npm สำหรับแอป Node.js

เมื่อใช้วิธีการเหล่านี้ คุณจะสามารถเพิ่ม ไลบรารีใดๆ ที่มีอยู่ลง ในแอปของคุณได้

จากซีดีเอ็น

คุณสามารถกำหนดค่าการนำเข้า Firebase JavaScript SDK บางส่วนได้ และโหลดเฉพาะผลิตภัณฑ์ Firebase ที่คุณต้องการเท่านั้น Firebase จัดเก็บแต่ละไลบรารีของ Firebase JavaScript SDK บน CDN ทั่วโลกของเรา (เครือข่ายการจัดส่งเนื้อหา)

  1. หากต้องการรวมเฉพาะ ผลิตภัณฑ์ Firebase ที่เฉพาะเจาะจง (เช่น การตรวจสอบสิทธิ์และ Cloud Firestore) ให้เพิ่มสคริปต์ต่อไปนี้ที่ด้านล่างของแท็ก <body> แต่ก่อนที่คุณจะใช้บริการ Firebase ใดๆ:

    <body>
      <!-- Insert this script at the bottom of the HTML, but before you use any Firebase services -->
      <script type="module">
        import { initializeApp } from 'https://www.gstatic.com/firebasejs/10.8.0/firebase-app.js'
    
        // If you enabled Analytics in your project, add the Firebase SDK for Google Analytics
        import { getAnalytics } from 'https://www.gstatic.com/firebasejs/10.8.0/firebase-analytics.js'
    
        // Add Firebase products that you want to use
        import { getAuth } from 'https://www.gstatic.com/firebasejs/10.8.0/firebase-auth.js'
        import { getFirestore } from 'https://www.gstatic.com/firebasejs/10.8.0/firebase-firestore.js'
      </script>
    </body>
    
  2. เพิ่มออบเจ็กต์การกำหนดค่า Firebase ของคุณ จากนั้นเริ่มต้น Firebase ในแอปของคุณ:

    <body>
      <script type="module">
        // ...
    
        // TODO: Replace the following with your app's Firebase project configuration
        const firebaseConfig = {
          // ...
        };
    
        // Initialize Firebase
        const app = initializeApp(firebaseConfig);
      </script>
    </body>
    

แอพ Node.js

  1. ติดตั้ง Firebase JavaScript SDK:

    1. หากคุณยังไม่มีไฟล์ package.json ให้สร้างไฟล์โดยการรันคำสั่งต่อไปนี้จากรากของโปรเจ็กต์ JavaScript ของคุณ:

      npm init
    2. ติดตั้งแพ็คเกจ firebase npm และบันทึกลงในไฟล์ package.json ของคุณโดยเรียกใช้:

      npm install --save firebase@10.8.0
  2. ใช้หนึ่งในตัวเลือกต่อไปนี้เพื่อใช้โมดูล Firebase ในแอปของคุณ:

    • คุณสามารถ require โมดูลจากไฟล์ JavaScript ใดก็ได้

      หากต้องการรวมเฉพาะ ผลิตภัณฑ์ Firebase ที่เฉพาะเจาะจง (เช่น การตรวจสอบสิทธิ์และ Cloud Firestore):

      // Firebase App (the core Firebase SDK) is always required and
      // must be listed before other Firebase SDKs
      var firebase = require("firebase/app");
      
      // Add the Firebase products that you want to use
      require("firebase/auth");
      require("firebase/firestore");
      


    • คุณสามารถใช้ ES2015 เพื่อ import โมดูล

      หากต้องการรวมเฉพาะ ผลิตภัณฑ์ Firebase ที่เฉพาะเจาะจง (เช่น การตรวจสอบสิทธิ์และ Cloud Firestore):

      // Firebase App (the core Firebase SDK) is always required and
      // must be listed before other Firebase SDKs
      import firebase from "firebase/app";
      
      // Add the Firebase services that you want to use
      import "firebase/auth";
      import "firebase/firestore";
      
  3. เพิ่มออบเจ็กต์การกำหนดค่า Firebase ของคุณ จากนั้นเริ่มต้น Firebase ในแอปของคุณ:

    import { initializeApp } from 'firebase/app';
    
    // TODO: Replace the following with your app's Firebase project configuration
    const firebaseConfig = {
      //...
    };
    
    // Initialize Firebase
    const app = initializeApp(firebaseConfig);