إعداد البيئة البرمجية

خصص محرر الكود الخاص بك لتحسين تجربة التطوير مع أسترو وفتح ميزات جديدة.

VS Code

قسم بعنوان VS Code

VS Code هو محرر شائع لمطوري الويب، من تطوير مايكروسوفت. المحرك الذي بُني عليه يُستخدم لتشغيل بعض محررات المتصفح الشائعة مثل GitHub Codespaces و Gitpod.

يعمل أسترو على أي محرر ولكنّا نوصي باستخدام VS Code لمشاريع أسترو. الإضافة الرسمية Astro VS Code تفعل العديد من المزايا المهمة، وتحسن تجربة التطوير على مشاريع أسترو.

• تلوين الجمل البرمجية (syntax highlighting) لملفات .astro
• دعم الأنواع للغة TypeScript على ملفات .astro
• اقتراحات VS Code لإكمال السطر، والتلميحات وغيرها.

للبدأ، ثبّت إضافة Astro VS Code الآن.

📚 انظر كيفة إعداد TypeScript في مشاريع أسترو.

بيئات تطوير JetBrains

قسم بعنوان بيئات تطوير JetBrains

وفرنا الدعم لأسترو على بيئة WebStorm منذ الإصدار 2023.1. يمكنك تحميل الملحق الرسمي من متجر JetBrains أو بالبحث عن “Astro” في تبويب الملحقات. تتضمن هذه الإضافة مزايا مثل تلوين الجمل البرمجية، وإكمال السطور البرمجية وتنسيقها، ونخطط لإضافة المزيد من المزايا المتقدمة مستقبلًا. كما إنها متاحة لبيئات JetBrains التي تدعم جافاسكربت.

محررات برمجية أخرى

قسم بعنوان محررات برمجية أخرى

يقدم مجتمعنا المذهل عدة إضافات للمحررات الشهيرة الأخرى، بما في ذلك:

• VS Code Extension on Open VSX دعم رسمي - إضافة VS Code الرسمية التي تحدثنا عنها أعلاه، متوفرة أيضا على مستودع Open VSX للمحررات المبنية عليه مثل VSCodium
• Nova Extension دعم مجتمعي - يوفر تلوين الجمل البرمجية، وإكمال الجمل على محرر Nova
• Vim Plugin دعم مجتمعي - يوفر تلوين الجمل البرمجية، وطي الكود، ويدعم الـ indentation على محررات Vim و Neovim
• Neovim LSP و TreeSitter لـ Neovim دعم مجتمعي - يوفّر تلوين الجمل البرمجية، (treesitter parsing)، وتوفير دعم الإكمال التلقائي في محرر Neovim
• emacs - راجع تعليمات ل تكوين Emacs و Eglot دعم مجتمعي للعمل مع أسترو
• أسترو syntax highlighting ل Sublime Text دعم مجتمعي - حزمة أسترو Sublime Text, متاح على مستودع Sublime Text.

المحررات في المتصفح

قسم بعنوان المحررات في المتصفح

بالإضافة للمحررات المثبة على جهازك، أسترو يعمل بشكل جيد على المحررات السحابية (المحررات في المتصفح عمومًا)، ويشمل الدعم:

• StackBlitz و CodeSandbox - محررات سحابية تعمل من المتصفح، تدعم تلوين الجمل البرمجية لملفات .astro بدون إعداد ولا تحميل!
• GitHub.dev - يسمح بتثبيت إضافة Astro VS Code كملحق web، ليوفر بعض مزايا الإضافة، حاليًا يوفر تلوين الجمل البرمجية فقط.
• Gitpod - بيئة تطوير سحابية كاملة يمكنها تثبيت إضافة Astro VS Code الرسمية من OpenVSX.

أدوات أخرى

قسم بعنوان أدوات أخرى

ESLint

قسم بعنوان ESLint

ESLint أشهر أدوات اكتشاف الأخطاء في الشفرة البرمجية لـ JavaScript و JSX. يمكنك تثبيت ملحق يدعمه المجتمع لأسترو أيضًا.

راجع دليل المستخدم الخاص بهم لمعرفة المزيد حول تثبيت وإعداد ESLint لمشروعك.

Stylelint

قسم بعنوان Stylelint

Stylelint أداة اكتشاف اخطاء شهيرة لـ CSS. إعدادات خاصة بأسترو مدعومة من المجتمع.

يمكن العثور على تعليمات التثبيت والتكامل مع المحررات ومعلومات إضافية في ملف README الخاص بالمشروع.

Prettier

قسم بعنوان Prettier

Prettier هو منسق شائع لأكواد JavaScript ،HTML ،CSS وغيرها. إذا كنت تستخدم إضافة أسترو لـ VS Code أو إضافة أسترو للمحررات الأخرى، فستجدها تتضمن تنسيق الكود بـ Prettier.

لدعم تنسيق أكواد أسترو خارج المحرر (على سبيل المثال في CLI) أو على محررات لا ندعمها، فاستخدم ملحق أسترو الرسمي لـ Prettier.

للبدأ، ثبّت Prettier أولًا، ثم ملحق أسترو على Prettier:

npm

npm install --save-dev prettier prettier-plugin-astro

pnpm

pnpm add -D prettier prettier-plugin-astro

Yarn

yarn add --dev prettier prettier-plugin-astro

Prettier سوف يتعرف تلقائيًا على ملحق أسترو عند تشغيله:

prettier --write .

راجع ملف README لإضافة أسترو على Prettier لمزيد من المعلومات حول الخيارات المدعومة وكيفية إعداد Prettier داخل VS Code والمزيد.