طرق بديلة لإضافة Firebase إلى مشروع JavaScript

بالنسبة إلى معظم تطبيقات الويب على Firebase، ننصحك بشدة باستخدام حزمة تطوير البرامج (SDK) من خلال npm. ومع ذلك، يوفّر Firebase للمستخدمين ذوي الاحتياجات الخاصة طرقًا بديلة لإضافة حزمة تطوير البرامج (SDK). تقدّم هذه الصفحة تعليمات مفصّلة حول إعداد الطرق البديلة التالية:

  • شبكة توصيل المحتوى (CDN)
  • npm لتطبيقات Node.js

باستخدام هذه الطرق، يمكنك إضافة أي من المكتبات المتاحة إلى تطبيقك.

من شبكة توصيل المحتوى (CDN)

يمكنك ضبط الاستيراد الجزئي لحزمة تطوير البرامج Firebase JavaScript وتحميل منتجات Firebase التي تحتاج إليها فقط. تخزِّن Firebase كل مكتبة من حزمة تطوير البرامج (SDK) Firebase JavaScript على شبكة توصيل المحتوى (CDN) العالمية.

  1. لتضمين منتجات Firebase معيّنة فقط (مثل Authentication و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/12.0.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/12.0.0/firebase-analytics.js'

    // Add Firebase products that you want to use
    import { getAuth } from 'https://www.gstatic.com/firebasejs/12.0.0/firebase-auth.js'
    import { getFirestore } from 'https://www.gstatic.com/firebasejs/12.0.0/firebase-firestore.js'
  </script>
</body>

  2. أضِف عنصر إعدادات Firebase، ثمّ ابدأ إعداد Firebase في تطبيقك:

    <body>
  <script type="module">
    // ...

    // TODO: Replace the following with your app's Firebase configuration
    const firebaseConfig = {
      // ...
    };

    // Initialize Firebase
    const app = initializeApp(firebaseConfig);
  </script>
</body>

تطبيقات Node.js

  1. ثبِّت حزمة تطوير البرامج (SDK) الخاصة بـ Firebase JavaScript:

    1. إذا لم يكن لديك ملف package.json، أنشئ واحدًا من خلال تشغيل الأمر التالي من جذر مشروع JavaScript:

      npm init

    2. ثبِّت حزمة firebase npm واحفظها في ملف package.json من خلال تنفيذ الأمر التالي:

      npm install --save firebase@12.0.0

  2. استخدِم أحد الخيارَين التاليَين لاستخدام وحدة Firebase في تطبيقك:

    • يمكنك require الوحدات من أي ملف JavaScript

      لتضمين منتجات معيّنة من Firebase (مثل Authentication و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");


    • يمكنك استخدام بنية ESM import الوحدات

      لتضمين منتجات معيّنة من Firebase (مثل Authentication و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 configuration
const firebaseConfig = {
  //...
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);