تخصيص مساحة العمل في Firebase Studio

تتيح لك Firebase Studio تخصيص مساحة العمل لتلبية الاحتياجات الفريدة لمشروعك من خلال تحديد ملف إعداد .idx/dev.nix واحد يصف ما يلي:

  • أدوات النظام التي تحتاج إلى تشغيلها (على سبيل المثال، من Terminal)، مثل برامج التجميع أو الملفات الثنائية الأخرى
  • الإضافات التي تحتاج إلى تثبيتها (على سبيل المثال، دعم لغة البرمجة).
  • كيفية عرض معاينات التطبيق (على سبيل المثال، الأوامر لتشغيل خادم الويب)
  • متغيرات البيئة العامة المتاحة للخوادم المحلية التي تعمل في مساحة العمل

راجِع مرجع dev.nix للحصول على وصف كامل للميزات المتاحة.

من خلال إضافة ملف .idx/mcp.json (لـ "Gemini في Firebase") أو .gemini/settings.json (لـ Gemini CLI) إلى مشروعك، يمكنك أيضًا الاتصال بخوادم Model Context Protocol (MCP)، بما في ذلك خادم Firebase MCP.

Nix وFirebase Studio

يستخدم Firebase Studio Nix لتحديد إعدادات البيئة لكل مساحة عمل. على وجه التحديد، تستخدم Firebase Studio ما يلي:

  • لغة البرمجة Nix لوصف بيئات مساحة العمل ‫Nix هي لغة برمجة وظيفية. تتّبع السمات ومكتبات الحِزم التي يمكنك تحديدها في ملف dev.nix بنية مجموعة سمات Nix.

  • مدير حزم Nix لإدارة أدوات النظام المتاحة في مساحة العمل وهذا يشبه مدراء الحزم الخاصة بنظام التشغيل، مثل APT (apt وapt-get) وHomebrew (brew) وdpkg.

بما أنّ بيئات Nix قابلة للتكرار وتوضيحية، يعني ذلك في سياق Firebase Studio أنّه يمكنك مشاركة ملف إعدادات Nix كجزء من مستودع Git لضمان توفّر إعدادات البيئة نفسها لدى كل من يعمل على مشروعك.

مثال أساسي

يوضّح المثال التالي إعدادًا أساسيًا للبيئة يتيح المعاينات:

{ pkgs, ... }: {

  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"

  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.nodejs_20
  ];

  # Sets environment variables in the workspace
  env = {
    SOME_ENV_VAR = "hello";
  };

  # Search for the extensions you want on https://open-vsx.org/ and use "publisher.id"
  idx.extensions = [
    "angular.ng-template"
  ];

  # Enable previews and customize configuration
  idx.previews = {
    enable = true;
    previews = {
      web = {
        command = [
          "npm"
          "run"
          "start"
          "--"
          "--port"
          "$PORT"
          "--host"
          "0.0.0.0"
          "--disable-host-check"
        ];
        manager = "web";
        # Optionally, specify a directory that contains your web app
        # cwd = "app/client";
      };
    };
  };
}

إضافة أدوات النظام

لإضافة أدوات النظام إلى مساحة العمل، مثل برامج الترجمة أو برامج واجهة سطر الأوامر (CLI) للخدمات السحابية، ابحث عن معرّف الحزمة الفريد في سجل حزم Nix وأضِفه إلى عنصر packages في ملف dev.nix، مع إضافة البادئة pkgs.:

{ pkgs, ... }: {
  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"

  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.nodejs_20
  ];
  ...
}

يختلف ذلك عن الطريقة التي قد تثبّت بها عادةً حِزم النظام باستخدام أدوات إدارة الحِزم الخاصة بنظام التشغيل، مثل APT (apt وapt-get) وHomebrew (brew) وdpkg. يؤدي الوصف التوضيحي الدقيق لحِزم النظام المطلوبة إلى تسهيل مشاركة مساحات العمل وإعادة إنتاجها.Firebase Studio

استخدام ملفات Node الثنائية المحلية

كما هو الحال على جهازك، يمكن تنفيذ الملفات الثنائية المرتبطة بحِزم node المثبَّتة محليًا (مثل الحِزم المحدّدة في package.json) في لوحة "الوحدة الطرفية" من خلال استدعائها باستخدام الأمر npx.

لتوفير المزيد من الراحة، إذا كنت في دليل يحتوي على مجلد node_modules (مثل الدليل الجذر لمشروع ويب)، يمكن استدعاء الملفات الثنائية المثبَّتة محليًا مباشرةً، بدون البادئة npx.

إضافة مكوّنات gcloud

يتوفّر إعداد تلقائي لواجهة سطر الأوامر gcloud في Google Cloud لجميع مساحات عمل Firebase Studio.

إذا كنت بحاجة إلى مكوّنات إضافية، يمكنك إضافتها إلى ملف dev.nix باتّباع الخطوات التالية:

{ pkgs }: {
  packages = [
    ...
    (pkgs.google-cloud-sdk.withExtraComponents [
      pkgs.google-cloud-sdk.components.cloud-datastore-emulator
    ])
    ...
  ];
}

إضافة إضافات IDE

يمكنك تثبيت الإضافات في Firebase Studio باستخدام سجلّ إضافات OpenVSX بطريقتَين:

  • استخدِم لوحة الإضافات في Firebase Studio لاستكشاف الإضافات وتثبيتها. هذا الأسلوب هو الأنسب للإضافات الخاصة بالمستخدم، مثل:

    • مظاهر ألوان مخصّصة
    • محاكاة المحرّر، مثل VSCodeVim
  • إضافة إضافات إلى ملف dev.nix سيتم تثبيت هذه الإضافات تلقائيًا عند مشاركة إعدادات مساحة العمل. هذه الطريقة هي الأفضل للإضافات الخاصة بالمشاريع، مثل:

    • إضافات لغات البرمجة، بما في ذلك أدوات تصحيح الأخطاء الخاصة بلغات معيّنة
    • الإضافات الرسمية لخدمات السحابة الإلكترونية المستخدَمة في مشروعك
    • أدوات تنسيق الرموز

في ما يتعلّق بالطريقة الأخيرة، يمكنك تضمين إضافات IDE في ملف dev.nix من خلال العثور على معرّف الإضافة المؤهّل بالكامل (بالتنسيق <publisher>.<id>) وإضافته إلى عنصر idx.extensions على النحو التالي:

{ pkgs, ... }: {
  ...
  # Search for the extensions you want on https://open-vsx.org/ and use the format
  # "<publisher>.<id>"
  idx.extensions = [
    "angular.ng-template"
  ];
  ...
}

إضافة خدمات شائعة

توفّر Firebase Studio أيضًا عملية إعداد وضبط مبسّطة للخدمات الشائعة التي قد تحتاج إليها أثناء التطوير، بما في ذلك:

  • الحاويات
    • Docker (services.docker.*)
  • المراسلة
    • محاكي Pub/Sub (services.pubsub.*)
  • قواعد البيانات
    • ‫MySQL (services.mysql.*)
    • Postgres (services.postgres.*)
    • Redis (services.redis.*)
    • Spanner (services.spanner.*)

للحصول على تفاصيل حول تفعيل هذه الخدمات في مساحة عملك، يُرجى الاطّلاع على أجزاء services.* في مرجع dev.nix.

تخصيص المعاينات

لمزيد من التفاصيل حول كيفية تخصيص معاينات التطبيق، يُرجى الاطّلاع على معاينة تطبيقك.

ضبط رمز مساحة العمل

يمكنك اختيار رمز مخصّص لمساحة العمل من خلال وضع ملف PNG باسم icon.png داخل الدليل .idx في المستوى نفسه الذي يوجد فيه ملف dev.nix. سيستخدم Firebase Studio هذا الرمز لتمثيل مساحة العمل في لوحة البيانات.

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

تحويل عمليات التخصيص إلى نموذج

لتحويل إعدادات بيئتك إلى "بيئة أساسية" يمكن لأي شخص استخدامها لإنشاء مشاريع جديدة، راجِع مستندات إنشاء نماذج مخصّصة.

الاطّلاع على جميع خيارات التخصيص

راجِع مرجع dev.nix للحصول على وصف تفصيلي لمخطط إعدادات البيئة.

تنزيل ملفاتك

لتنزيل ملفاتك كملف zip، اتّبِع الخطوات التالية:

  • انقر بزر الماوس الأيمن على أي دليل في لوحة &quot;المستكشف&quot; واختَر ضغط وتنزيل.

لتنزيل كل المحتوى في دليل مشروعك، اتّبِع الخطوات التالية:

  1. انقر على ملف > فتح مجلد.

  2. قبول دليل /home/user التلقائي

  3. بعد تحميل الملفات، انقر بزر الماوس الأيمن على دليل العمل واختَر ضغط الملفات وتنزيلها. في حال استخدام App Prototyping agent، سيكون دليل العمل هو studio. إذا كنت تستخدم نموذجًا أو مشروعًا تم تحميله، سيكون هذا هو اسم مشروعك.

  4. عندما يُطلب منك إعادة إنشاء البيئة، انقر على إلغاء.

  5. بعد اكتمال عملية التنزيل، أعِد فتح دليل العمل من قائمة ملف (File) للعودة إلى مساحة عملك.

استخدام خوادم MCP

توفّر خوادم MCP أدوات ومصادر بيانات إضافية لاستخدامها في Gemini. على سبيل المثال، يمكنك إضافة خادم MCP الخاص ببرنامج Firebase لاستكشاف بياناتك في Cloud Firestore باستخدام اللغة الطبيعية أثناء إنشاء تطبيقك أو تصحيح أخطائه.

المتطلبات الأساسية

  • إذا كان خادم MCP يتطلّب ذلك، تأكَّد من تثبيت Node.js وnpm بشكل صحيح.

اختيار خادم MCP متوافق

يتوافق Firebase Studio بشكل أساسي مع خوادم MCP، ما يعني أنّ بعض خوادم MCP غير متوافقة. عند اختيار خادم MCP لإضافته إلى مساحة عملك في Firebase Studio، يُرجى مراعاة ما يلي:

  • متاح:
    • خوادم النقل التي لا تتطلّب أشكالاً خاصة من المصادقة، مثل خوادم الإدخال/الإخراج العادية (stdio) أو خوادم الأحداث التي يرسلها الخادم (SSE) أو خوادم HTTP القابلة للبث
    • الأدوات التي توفّرها خوادم MCP
  • غير متاح حاليًا:
    • الخوادم التي تتطلّب واجهة مستخدم رسومية أو جلسة على الكمبيوتر
    • الطلبات أو العيّنات أو الموارد الأخرى التي توفّرها خوادم MCP

إضافة خادم MCP

  1. من "المستكشف" (Ctrl+Shift+E)، عدِّل ملف إعداد MCP أو أنشئه.

    • يستخدم Gemini في محادثة Firebase .idx/mcp.json.

    • يستخدم Gemini CLI .gemini/settings.json.

    إذا لم يكن الملف موجودًا بعد، أنشئه من خلال النقر بزر الماوس الأيمن على الدليل الرئيسي واختيار ملف جديد. أنشئ الملفَين أو عدِّلهما لاستخدام خادم MCP في Gemini في Firebase وGemini CLI.

  2. أضِف إعدادات الخادم إلى محتوى الملف. على سبيل المثال، لإضافة خادم Firebase MCP، أدخِل ما يلي:

    {
      "mcpServers": {
       "firebase": {
         "command": "npx",
         "args": [
           "-y",
           "firebase-tools@latest",
           "experimental:mcp"
          ]
        }
      }
    }
    

    يُعلِم ملف الإعداد هذا Gemini خادم MCP الذي تريد استخدامه. في هذا المثال، أضفنا خادمًا واحدًا باسم firebase سيستخدم الأمر npx لتثبيت firebase-tools@latest وتشغيله. تتطلّب خوادم MCP الأخرى إعدادات مختلفة، ولكنها تتّبع التنسيق العام نفسه.

  3. في الوحدة الطرفية (Shift+Ctrl+C)، شغِّل أي أوامر ضرورية لإكمال عملية التثبيت. على سبيل المثال، لاستخدام خادم Firebase MCP، أدخِل الأمر التالي لتسجيل الدخول إلى حسابك:

    firebase login --no-localhost
    

    اتّبِع التعليمات الواردة في الجهاز الطرفي للسماح بالجلسة. تتطلّب بعض الأدوات مشروعًا مرتبطًا على Firebase. يمكنك استخدام خادم Firebase MCP لإنشاء مشروع، أو يمكنك تنفيذ الأمر التالي لتهيئة مشروع Firebase:

    firebase init
    

    سيؤدي ذلك إلى إنشاء ملف firebase.json في الدليل الجذر.

  4. أعِد إنشاء مساحة العمل لإكمال عملية الإعداد:

    1. افتح "لوحة الأوامر" (Shift+Ctrl+P).

    2. أدخِل Firebase Studio: إعادة إنشاء البيئة.

استخدام أدوات "برنامج الشركاء المعتمدين"

بعد تثبيت خادم MCP الذي تريد استخدامه، ستتوفّر الأدوات أو البيانات التي يقدّمها في:

  • ‫Gemini CLI
  • ‫Gemini في محادثة Firebase عند استخدام وضع "الوكيل" ووضع "الوكيل" (التشغيل التلقائي)
  • App Prototyping agent

على سبيل المثال، إذا أضفت خادم MCP الخاص بمنصة Firebase، يمكنك أن تطلب من Gemini جلب إعدادات حزمة SDK للمشروع الحالي، واسترداد البيانات المخزّنة في Cloud Firestore وRealtime Database، ومساعدتك في إعداد خدمات Firebase، وغير ذلك.

تحديد المشاكل في خوادم MCP وحلّها

إذا لم يعمل خادم MCP على النحو المتوقّع، افتح Gemini السجلات للتحقّق من وجود أخطاء:

  1. في قسم "الإخراج" (Shift+Ctrl+U)، انقر على القائمة المنسدلة واختَر Gemini.

  2. ابحث عن الرسائل التي تبدأ بعلامة [MCPManager]. تحتوي هذه السجلّات على معلومات حول خوادم MCP التي تم إعدادها، بالإضافة إلى أي رسائل خطأ. استخدِم هذه المعلومات لتحديد المشاكل في إعداداتك وحلّها. عندما يتصل خادم MCP بنجاح، ستظهر لك قائمة بالأدوات التي أضافها.

جرِّب إعادة إنشاء مساحة العمل إذا تعذّر تثبيت خادم MCP أو الاتصال به:

  1. افتح "لوحة الأوامر" (Shift+Ctrl+P).

  2. أدخِل Firebase Studio: إعادة إنشاء البيئة.

  3. انتظِر إلى أن تتم إعادة إنشاء مساحة العمل، ثم حاوِل استخدام خادم MCP الذي اخترته مرة أخرى.

إذا كان خادم MCP يتصل، ولكن لا يستخدم Gemini الأدوات التي يوفّرها:

الخطوات التالية