Editör Ayarları

Astro geliştirici deneyimini iyileştirmek ve yeni özelliklerin kilidini açmak için kod düzenleyicinizi özelleştirin.

VS Code

VS Code, Microsoft tarafından oluşturulmuş, web geliştiricileri için popüler bir kod düzenleyicisidir. VS Code motoru ayrıca GitHub Codespaces ve Gitpod gibi popüler tarayıcı içi kod editörlerine de destek sağlar.

Astro, herhangi bir kod düzenleyiciyle çalışır. Ancak VS Code, Astro projeleri için önerdiğimiz editördür. Astro projeleri için çeşitli temel özelliklerin ve geliştirici deneyimi iyileştirmelerinin kilidini açan resmi bir Astro VS Code Uzantısına sahibiz.

• .astro dosyaları için sözdizimi vurgulama.
• .astro dosyaları için TypeScript türü bilgileri.
• Kod tamamlama, ipuçları ve daha fazlası için VS Code Intellisense.

Başlamak için Astro VS Code Extension’ı bugün kurun.

JetBrains IDE

Astro için ilk destek WebStorm 2023.1’de geldi. Resmi eklentiyi JetBrains Marketplace aracılığıyla veya IDE’nin Eklentiler sekmesinde ‘Astro’ yazarak yükleyebilirsiniz. Bu eklenti, sözdizimi vurgulama, kod tamamlama ve biçimlendirme gibi özellikler içerir ve gelecekte daha da gelişmiş özellikler eklemeyi planlamaktadır. JavaScript desteğine sahip diğer tüm JetBrains IDE ‘leri tarafından da kullanılabilir.

JetBrains’in yaklaşmakta olan Fleet IDE’si, dil sunucusu desteği içerir ve resmi Astro araçlarını kullanabilecektir.

Diğer Editörler

Harika topluluğumuz, diğer popüler düzenleyiciler için aşağıdakiler dahil çeşitli uzantılara sahiptir:

• Open VSX ‘de VS Kod Uzantısı (Resmi Uzantısıdır) - VSCodium gibi açık platformlar için Open VSX kayıt defterinde bulunan resmi Astro VS Code Uzantısı
• Nova Uzantısı (Topluluk Uzantısıdır) - Nova’nın içindeki Astro için sözdizimi vurgulama ve kod tamamlama sağlar
• Vim Eklenti (Topluluk Uzantısıdır) - Astro için Vim veya Neovim içinde sözdizimi vurgulama, girinti ve kod katlama desteği sağlar
• Neovim LSP ve TreeSitter Eklentileri (Topluluk Uzantısıdır) - Astro için Neovim içinde sözdizimi vurgulama, ağaç bakıcısı ayrıştırma ve kod tamamlama sağlar

Tarayıcı editörlerine

Astro, yerel düzenleyicilere ek olarak, tarayıcıda barındırılan düzenleyicilerde de iyi çalışır:

• StackBlitz ve CodeSandbox - .astro dosyaları için yerleşik sözdizimi vurgulama desteğiyle tarayıcınızda çalışan çevrimiçi düzenleyiciler. Kurulum veya yapılandırma gerekmez!
• GitHub.dev - Astro VS Code uzantısını bir web uzantısı olarak kurmanıza izin verir, bu da tam uzantı özelliklerinden yalnızca bazılarına erişmenizi sağlar. Şu anda yalnızca sözdizimi vurgulama desteklenmektedir.
• Gitpod - Open VSX’ten resmi Astro VS Kod Uzantısını yükleyebilen bulutta eksiksiz bir geliştirme ortamı.

Diğer Araçlar

ESLint

ESLint JSX ve JavaScript için Poüler Kod denetleyici aracıdır. Astro desteği için topluluk tarafından yönetilen bir eklenti kurulabilir.

ESLint’i projeniz için nasıl kuracağınız ve kuracağınız hakkında daha fazla bilgi için projenin Kullanıcı Kılavuzuna bakın.

Stylelint

Stylelint, CSS için popüler bir Kod denetleyici aracıdır. Topluluk tarafından yönetilen bir Stylelint yapılandırması, Astro desteği sağlar.

Kurulum talimatları, editör entegrasyonu ve ek bilgiler projenin README Dosyasında bulunabilir.

Prettier

Prettier, JavaScript, HTML, CSS ve daha fazlası için popüler bir biçimlendiricidir. Astro VS Kod Uzantısını veya Astro dil sunucusunu başka bir düzenleyicide kullanıyorsanız, Prettier ile kod biçimlendirme dahildir.

.astro dosyalarını düzenleyicinin dışında (örn. CLI) veya düzenleyici araçlarımızı desteklemeyen düzenleyicilerin içinde biçimlendirme desteği eklemek için resmi Astro Prettier eklentisini yükleyin.

Başlamak için önce Prettier’i ve eklentiyi kurun:

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

Prettier daha sonra otomatik olarak eklentiyi algılayacak ve çalıştırdığınızda .astro dosyalarını işlemek için kullanacak :

prettier --write .

Prettier eklentisinin desteklenen seçenekleri, VS Code içinde Prettier’ı nasıl kuracağınız ve daha fazlası hakkında daha fazla bilgi için Prettier eklentisinin README dosyasına bakın.