Chrome DevTools içinden Blazor bileşenlerini ve hizmetlerini inceleyin
Blazor Geliştirici Araçları, Alex Howard tarafından oluşturulmuş, geliştiricilerin ASP.NET Core Blazor uygulamalarını geliştirme sırasında hata ayıklamalarına yardımcı olan bir Chrome uzantısıdır. Konsol günlüğüne güvenmeden bileşen ilişkilerini ve çalışma zamanı bilgilerini ortaya çıkarmak için tarayıcı Geliştirici Araçları'na bir denetim paneli ekler. Uzantı, Sunucu ve WebAssembly ana bilgisayarlarını tespit eder ve küçük bir çalışma zamanı entegrasyonu gerektirir; bu entegrasyon bir NuGet paketi aracılığıyla sağlanır. Hedef kitle, yerel olarak kodlama yaparken görsel, çalışma zamanı farkındalığına sahip hata ayıklamayı tercih eden Blazor geliştiricileridir.
Aracın bileşen iç yapılarını gerçek zamanlı olarak nasıl açığa çıkardığı
Uzantı, hata ayıklamayı konsol günlüklerinden çıkarıp özel bir DevTools paneline taşıyan görsel bir inceleme iş akışı sağlar. O panelin içinde gerçek zamanlı bir bileşen ağacını görebilir ve seçilen düğümler için parametre değerlerini, zincirleme parametreleri, beyan edilen türleri ve iç durumu inceleyebilirsiniz. Bir öğe seçici, DOM öğelerini bileşen girişleriyle ilişkilendirir, bu da sayfayla etkileşimde bulunurken render yollarını ve durum değişikliklerini takip etmenize yardımcı olur.
Ne kurmalısınız ve nerede görünecek
Kurulumun iki kısmı vardır: Chrome uzantısını ekleyin ve NuGet paketini Blazor projesine dahil edin, ardından Program.cs'de hizmetini kaydedin. Kurulumdan sonra, denetleyici DevTools'ta 'Blazor' sekmesi olarak görünür (F12 ile açın veya İncele). Araç, Sunucu veya WebAssembly barındırmasını otomatik olarak algılar, böylece aynı denetleyici iş akışı her iki barındırma modeli için de çalışır.
Üretim ve güvenlik ile nasıl başa çıktığı
Güvenlik, çalışma zamanı kapama mekanizmasına entegre edilmiştir. Araç, Geliştirme modunun dışında kendini devre dışı bırakır ve üretim sitelerinde bileşen meta verilerinin açığa çıkmasını engeller. Bu otomatik kapama, projelerin dağıtım sonrası inceleme için gerekli çalışma zamanı kancalarını sunmamasını sağlar, bileşen parametrelerini ve hizmet düzenlemelerini kamuya açık yapımlardan uzak tutarken yerel ve sahneleme tanılamalarını korur.
Kimin faydalandığı ve hata ayıklama iş akışlarını nasıl şekillendirdiği
JavaScript geliştirici araçlarından .NET'e geçiş yapan geliştiricilere uygundur. Panel, HTML'yi .razor dosyalarına manuel olarak eşleştirme ihtiyacını azaltan React benzeri bir inceleme akışı sunar. DI görüntüleyici, bir bileşenin hangi hizmetleri çözdüğünü ortaya çıkarır, bu da orta ve büyük kod tabanlarında hizmete bağımlı davranışları giderirken yardımcı olur. Görsel izleri, rastgele günlüğe kaydetmeye tercih eden ekipler, en net verimlilik artışını elde ederler.
Küçük proje değişikliklerini kabul eden geliştirme iş akışları için en uygun
Araç, geliştirme sırasında doğrudan çalışma zamanı görünürlüğüne ihtiyaç duyan Blazor geliştiricileri için pratik bir seçimdir. Bu takas, projelere küçük bir çalışma zamanı kancası eklemeyi gerektirir ve dağıtım sonrası denetleyicinin kullanılamayacağını kabul eder. Bu nedenle, yerel olarak kodlama yaparken bileşen sorunlarının daha hızlı, görsel teşhisini önceliklendiren ekipler için uygundur, uzaktan, dağıtım sonrası inceleme yerine.
