# Claude Code في VS Code: التثبيت وربط مفتاح API وطريقة العمل

> ثبّت إضافة Claude Code في VS Code، ثم سجّل الدخول أو اربط مفتاح API، واستخدم مقارنة التعديلات والإشارة إلى الملفات ونقاط الاستعادة ونسخة الطرفية.

آخر تحديث: 2026-11-01

لاستخدام Claude Code في VS Code، ثبّت إضافة Claude Code التي تنشرها Anthropic من لوحة الإضافات، ثم افتحها من أيقونة Spark أعلى يمين المحرر. بعدها سجّل الدخول باشتراك Claude، أو أضف مفتاح API وعنوان الأساس إلى الإعداد `claudeCode.environmentVariables`. وتحتاج إلى VS Code بالإصدار 1.94.0 أو أحدث.

## ما الذي تحتاجه؟

- **VS Code بالإصدار 1.94.0 أو أحدث.** تجد رقم إصدارك في Help > About. ويستطيع Cursor وغيره من المحررات المبنية على VS Code تثبيت الإضافة نفسها.
- **طريقة للدفع مقابل النموذج:** اشتراك Claude من Anthropic يشمل Claude Code، مثل Pro وMax وUltra وTeam وEnterprise، أو حساب في Anthropic Console، أو مفتاح API من خدمة متوافقة مثل 5abeer.

## كيف أثبّت إضافة Claude Code؟

### 1. افتح لوحة الإضافات

اضغط `Ctrl+Shift+X` على ويندوز ولينكس، أو `Cmd+Shift+X` على macOS.

### 2. ابحث عن الإضافة وثبّتها

اكتب Claude Code في خانة البحث، واختر الإضافة التي تنشرها Anthropic، ثم اضغط **Install**. معرّف الإضافة هو `anthropic.claude-code`، لذلك تستطيع تثبيتها من الطرفية أيضًا:

```bash
code --install-extension anthropic.claude-code
```

### 3. افتح ملفًا

افتح أي ملف في مشروعك، فتظهر أيقونة Spark أعلى يمين المحرر، وتصبح الإضافة جاهزة.

## كيف أفتح Claude Code في VS Code؟

| المكان | ما تفعله |
| --- | --- |
| شريط أدوات المحرر | اضغط أيقونة Spark أعلى اليمين، مع وجود ملف مفتوح. |
| شريط الأنشطة (Activity Bar) | اضغط أيقونة Spark في الشريط الجانبي الأيسر. |
| شريط الحالة (Status Bar) | اضغط ✻ Claude Code أسفل اليمين. يعمل دون فتح أي ملف. |
| لوحة الأوامر (Command Palette) | اضغط `Ctrl+Shift+P`، واكتب Claude Code، ثم اختر Open in New Tab أو Open in Side Bar أو Open in New Window. |

## هل أسجّل الدخول باشتراك Claude أم أربط مفتاح API؟

**باشتراك Claude:** اضغط **Sign in** في لوحة Claude Code، ثم أتمّ تسجيل الدخول في المتصفح.

**بمفتاح API:** تذهب الطلبات إلى عنوان الأساس الذي تضبطه، ويُحاسب صاحب المفتاح على كل توكن، لذلك لا تخضع هذه الطلبات لحدود الاشتراك. أنشئ مفتاحًا من لوحة التحكم ([طريقة إنشاء المفتاح](https://5abeer.ai/ar/docs/start/keys.md#create)). وهذه هي القيم التي يحتاجها Claude Code، معروضة في صورة ملف إعداداته:

`~/.claude/settings.json`

```json
{
  "env": {
    "ANTHROPIC_BASE_URL": "https://api.5abeer.ai",
    "ANTHROPIC_AUTH_TOKEN": "YOUR_5ABEER_API_KEY",
    "ANTHROPIC_MODEL": "claude-sonnet-5.5"
  }
}
```

تتحقق الإضافة من وجود مفتاح قبل أن تبدأ، ويقرأ هذا التحقق إعدادًا خاصًا بها في VS Code هو `claudeCode.environmentVariables`. أما القيم في الملف `~/.claude/settings.json` فتصل إلى Claude Code بعد تشغيله، لكنها لا تصل إلى هذا التحقق. لذلك ضع المفتاح في إعدادات المستخدم في VS Code:

### 1. افتح إعدادات المستخدم

اضغط `Ctrl+Shift+P`، أو `Cmd+Shift+P` على macOS، ثم شغّل الأمر **Preferences: Open User Settings (JSON)**.

### 2. أضف المتغيرات

أضف الإدخال `claudeCode.environmentVariables`. وإذا كان في الملف إعدادات من قبل، فأبقِها وافصل بين الإدخالات بفواصل.

```json
{
  "claudeCode.environmentVariables": [
    { "name": "ANTHROPIC_BASE_URL", "value": "BASE_URL" },
    { "name": "ANTHROPIC_AUTH_TOKEN", "value": "YOUR_5ABEER_API_KEY" }
  ]
}
```

ضع قيمة `ANTHROPIC_BASE_URL` من الإعدادات المعروضة أعلاه مكان `BASE_URL`، وضع مفتاحك مكان `YOUR_5ABEER_API_KEY`.

### 3. أعد التحميل وتحقق

احفظ الملف، وشغّل **Developer: Reload Window** من لوحة الأوامر، ثم افتح Claude Code من جديد، وأرسل رسالة قصيرة. إذا جاء الرد دون شاشة تسجيل الدخول، فالمفتاح يعمل، ويظهر الطلب في لوحة التحكم تحت هذا المفتاح.

تشترك الإضافة ونسخة الطرفية في الملف `~/.claude/settings.json`، فإذا وضعت فيه القيم نفسها، فسيستخدم الأمر `claude` مفتاحك في أي طرفية أيضًا. وإذا بقيت شاشة تسجيل الدخول، ففعّل الخيار **Disable Login Prompt** من Settings > Extensions > Claude Code، واسمه في ملف الإعدادات `claudeCode.disableLoginPrompt`.

> احفظ المفتاح في إعدادات المستخدم، لا في ملف `.vscode/settings.json` داخل مشروع، لأن هذا الملف يُرفع غالبًا إلى Git. وإذا كنت تستخدم مزامنة الإعدادات (Settings Sync) في VS Code، فقد تُنسخ إعدادات المستخدم إلى أجهزتك الأخرى.

## كيف تعمل مع Claude Code في VS Code؟

### أوضاع الأذونات

بدّل الوضع من خانة الكتابة:

- **Manual:** يستأذنك Claude قبل تعديل الملفات وقبل أغلب أوامر الطرفية، ويُفتح كل تعديل في مقارنة جنبًا إلى جنب مع زرّي Accept وReject.
- **Plan:** يقرأ Claude ويكتب خطة، ثم ينتظر موافقتك قبل أن يغيّر أي شيء.
- **Edit automatically:** يعدّل Claude الملفات دون أن يستأذنك.
- **Auto:** يراجع مصنِّف آلي في الخلفية أغلب الإجراءات بدلًا من أن يستأذنك.

ويحدد الإعداد `claudeCode.initialPermissionMode` الوضع الذي تبدأ به المحادثات الجديدة.

### أعطِ Claude السياق

- اكتب `@` ثم اسم ملف أو مجلد، مثل `@src/app.ts` أو `@src/`. ولتحديد أسطر بعينها، اكتب `@app.ts#5-10`.
- حدّد جزءًا من الكود في المحرر، واضغط `Alt+K`، أو `Option+K` على macOS، لتشير إلى الملف والأسطر المحددة.
- الصق لقطة شاشة في خانة الكتابة، أو اسحب ملفًا إليها مع الضغط على Shift.

### تراجع بنقاط الاستعادة

مرّر المؤشر فوق إحدى رسائلك السابقة لتعود إليها. الخيار **Fork conversation from here** يفرّع المحادثة ويبقي ملفاتك كما هي، والخيار **Rewind code to here** يلغي تعديلات Claude على الملفات بعد تلك النقطة، والخيار **Fork conversation and rewind code** يفعل الأمرين. وتجد الجلسات السابقة تحت زر سجل الجلسات.

### الأوامر والاختصارات

اكتب `/` في خانة الكتابة لتعرض الأوامر التي تدعمها الإضافة، ومنها:

- `/model`: لتبديل النموذج.
- `/compact`: لاختصار محادثة طويلة.
- `/status`: لعرض الإصدار والحساب والنموذج.
- `/mcp`: لإدارة خوادم MCP.
- `/plugins`: لإدارة الملحقات.

| الإجراء | ويندوز ولينكس | macOS |
| --- | --- | --- |
| نقل التركيز بين المحرر وClaude | `Ctrl+Esc` | `Cmd+Esc` |
| الإشارة إلى الكود المحدد | `Alt+K` | `Option+K` |
| سطر جديد دون إرسال | `Shift+Enter` | `Shift+Enter` |

## الإضافة أم نسخة الطرفية؟

تستطيع استخدام الاثنتين في المشروع نفسه:

| الميزة | الإضافة | نسخة الطرفية |
| --- | --- | --- |
| مراجعة التعديلات في VS Code | نعم | نعم، بعد ربطها بـ VS Code |
| الأوامر | جزء منها | كلها |
| اختصار `!` لتشغيل أمر في الطرفية | لا | نعم |
| الإكمال بزر Tab | لا | نعم |
| خوادم MCP ونقاط الاستعادة | نعم | نعم |

لتشغيل نسخة الطرفية داخل VS Code، افتح طرفية من قائمة Terminal وشغّل `claude`. ويحتاج ذلك إلى تثبيت نسخة الطرفية ([تثبيت Claude Code على ويندوز](https://5abeer.ai/ar/guides/claude-code-windows-install))، لأن النسخة التي تحملها الإضافة لا تُضاف إلى PATH. وفي طرفية خارج VS Code، شغّل `/ide` داخل Claude Code لربطه بالمحرر، فتُفتح تعديلاته في عارض المقارنة في VS Code، ويرى ما حددته من كود وأخطاء المحرر. ويستطيع الأمر `claude --resume` أيضًا استئناف محادثة بدأتها في الإضافة.

## كيف أحل الأخطاء الشائعة؟

- **لا تُثبَّت الإضافة:** تأكد أن إصدار VS Code هو 1.94.0 أو أحدث، وأن لديك إذنًا بتثبيت الإضافات، أو ثبّتها من صفحتها في Visual Studio Marketplace.
- **لا تظهر أيقونة Spark:** افتح ملفًا أولًا، أو استخدم ✻ Claude Code في شريط الحالة. وإذا بقيت مختفية، فشغّل Developer: Reload Window، وعطّل إضافات الذكاء الاصطناعي الأخرى التي قد تتعارض معها، مثل Cline أو Continue، وتأكد أن المجلد ليس في الوضع المقيّد (Restricted Mode).
- **اللوحة فارغة:** حدّث الإضافة، وشغّل Developer: Reload Window، ثم اقرأ مخرجات الأمر **Claude Code: Show Logs**.
- **رسالة `'claude' is not recognized` في الطرفية:** لا تضيف الإضافة الأمر `claude` إلى PATH، فثبّت نسخة الطرفية أيضًا.

### ما زال Claude Code يطلب تسجيل الدخول

لم تعثر الإضافة على مفتاح في إعدادها الخاص. تأكد أن `claudeCode.environmentVariables` موجود في إعدادات المستخدم لا في إعدادات مشروع، وأن صيغة JSON في الملف صحيحة، ثم أعد تحميل النافذة. وإذا بقيت شاشة تسجيل الدخول، ففعّل Disable Login Prompt. كما أن فتح VS Code من طرفية بالأمر `code .` ينقل متغيرات تلك الطرفية إلى الإضافة.

وإذا رُفض طلب برمز خطأ، فالرمز [`INVALID_API_KEY`](https://5abeer.ai/ar/docs/help/errors.md#INVALID_API_KEY) يعني أن المفتاح خطأ أو محذوف، والرمز [`INSUFFICIENT_BALANCE`](https://5abeer.ai/ar/docs/help/errors.md#INSUFFICIENT_BALANCE) يعني أن رصيدك لا يكفي للطلب. وكل الرموز في [رموز الأخطاء وحلولها](https://5abeer.ai/ar/docs/help/errors.md).

## كيف أشغّل الإضافة عبر 5abeer؟

5abeer خدمة مستقلة متوافقة مع واجهة Anthropic Messages، لذلك تعمل الإضافة كما تصدرها Anthropic، ولا يتغير إلا عنوان الأساس والمفتاح.

- **مفتاح API تدفع فيه حسب الاستخدام.** تدفع ثمن التوكنات من رصيدك، وتضع لكل مفتاح حد إنفاق وتاريخ انتهاء وقائمة عناوين IP مسموح بها ([التحكم في المفاتيح](https://5abeer.ai/ar/docs/start/keys.md#controls)). وأسعار Claude في [صفحة Claude API](https://5abeer.ai/ar/api/claude).
- **باقة 5abeer.** يفعّل تطبيق 5abeer AI أداة Claude Code على باقتك ([ما الذي تشغّله كل باقة](https://5abeer.ai/ar/docs/subscriptions/plan-apps.md#claude-code)). الباقات مخصصة للتطبيقات المدعومة، ولاستخدام النماذج من الكود الخاص بك تحتاج إلى مفتاح API. راجع [صفحة الأسعار](https://5abeer.ai/ar/pricing) و[صفحة Claude Code](https://5abeer.ai/ar/apps/claude-code).

وكل الإعدادات مشروحة في [صفحة Claude Code في التوثيق](https://5abeer.ai/ar/docs/apps/claude-code.md).

## أسئلة شائعة

### هل تعمل الإضافة في Cursor وغيره من المحررات المبنية على VS Code؟

نعم. يثبّت Cursor الإضافة نفسها، وتستطيع المحررات الأخرى المبنية على VS Code تثبيتها من سجل Open VSX. ابحث عن Claude Code في لوحة الإضافات في المحرر، وتأكد أن ناشرها هو Anthropic. وفي المحرر الذي لا يستطيع تثبيتها، شغّل `claude` في الطرفية المدمجة فيه.

### هل أحتاج إلى تثبيت نسخة الطرفية أيضًا؟

لا. تحمل الإضافة نسختها الخاصة من Claude Code. ثبّت نسخة الطرفية فقط إذا أردت تشغيل الأمر `claude` في طرفية أيضًا.

### هل للإضافة تكلفة؟

تثبيت الإضافة بلا مقابل، وتدفع مقابل استخدام النموذج: عبر اشتراك Claude، أو حسب التوكنات على مفتاح API الذي تربطه.

### هل أستطيع التراجع عن تعديلات Claude؟

نعم. مرّر المؤشر فوق رسالة سابقة واختر Rewind code to here. وحفظ نسخة من عملك في Git قبل أي مهمة كبيرة يمنحك شبكة أمان ثانية.

### أي نموذج تستخدم الإضافة؟

ابدأ بالنموذج الافتراضي [`claude-sonnet-5.5`](https://5abeer.ai/ar/models/claude-sonnet-5.5)، فهو يكفي أغلب مهام البرمجة. وانتقل إلى [`claude-opus-5.5`](https://5abeer.ai/ar/models/claude-opus-5.5) أو [`claude-fable-5.1`](https://5abeer.ai/ar/models/claude-fable-5.1) في أصعب المشكلات. بدّل النموذج للجلسة بالأمر `/model` في خانة الكتابة. ولتغيير النموذج الذي تبدأ به الجلسات الجديدة، عدّل `ANTHROPIC_MODEL` في الملف `~/.claude/settings.json`. والقائمة كاملة بأسعارها في [صفحة النماذج](https://5abeer.ai/ar/models).

### كيف أزيل الإضافة؟

افتح لوحة الإضافات، وابحث عن Claude Code، ثم اضغط Uninstall. وفي الوضع الافتراضي، يعيد تشغيل `claude` في طرفية VS Code تثبيت الإضافة تلقائيًا. ولمنع ذلك، أوقف الخيار **Auto-install IDE extension** من `/config`، أو اضبط المتغير `CLAUDE_CODE_IDE_SKIP_AUTO_INSTALL=1`.

## المصادر

راجعناها في 2026-11-01:

- توثيق Claude Code: [Use Claude Code in VS Code](https://code.claude.com/docs/en/vs-code)
- توثيق Claude Code: [Connect Claude Code to an LLM gateway](https://code.claude.com/docs/en/llm-gateway-connect)

> 5abeer خدمة مستقلة، ولا تتبع OpenAI أو Anthropic أو Google.

## ابدأ

ثبّت نسخة الطرفية بدليل [تثبيت Claude Code على ويندوز](https://5abeer.ai/ar/guides/claude-code-windows-install)، وقارن بين الاشتراك ومفتاح API في [أرخص طريقة لاستخدام Claude Code](https://5abeer.ai/ar/guides/claude-code-cheapest-way)، أو تعرّف إلى الأساسيات في [ما هو مفتاح API وكيف تحصل على واحد](https://5abeer.ai/ar/guides/ai-api-key-guide).