Tarayıcı geliştirici araçlarını Visual Studio Code'a getirme

Geçen yıl, geliştiricilere tarayıcı geliştiricisi gömme seçeneği veren uzantısı deneysel “VS Kodu için Elements” yayınlandı için Visual Studio Kanunu içine ols.
To gün biz heyecanlıyız  için yeni genel durumu duyurmak Microsoft Kenar  için VS Kod uzatma ols önemli ölçüde iyileştirilmiştir ve şimdi ilk kez önizleme çıkarken,.
Bu sürümde, Geliştirici getirdiği iki deneysel uzantıları işlevselliğini Birleştirdiğiniz  için ols işlevselliği  için  Elemanları ve Ağ uzantısı: Visual Studio Kodu. Biz de kolaylaştırdı  için  katkıda bulunacak ve uzantısını kendiniz ve kaba kenarları bazı düzeltti kurmak.
VS Kodu için Edge Geliştirici Araçları iş başında: bir sunucuya bağlanma, başsız bir tarayıcı açma, bir DOM öğesi seçme ve CSS'sini VS Kodunda düzenleme.
VS Kodu için Edge Geliştirici Araçları iş başında: bir sunucuya bağlanma, başsız bir tarayıcı açma, bir DOM öğesi seçme ve CSS'sini VS Kodunda düzenleme.
Visual Studio Marketplace'ten indirebilir veya Visual Studio Code içinden yükleyebilirsiniz.

Geliştirici araçlarını neden bir düzenleyiciye yerleştirmelisiniz?

Visual Studio Code, geliştiriciler olarak hayatımızı kolaylaştıran birçok özelliğe sahiptir, ancak haklı olarak en iyi yaptığı şeye, yani hafif bir programlama ortamına sadık kalır. Web için ürünler oluşturduğumuzda, bunları programlamak çoğu zaman yeterli olmaz. İş akışımızın büyük bir kısmı, ürünlerimizin görünümünü ve verdiği hissi ayarlamaktan ibarettir. Tarayıcıda yerleşik olan geliştirici araçlarının parladığı yer burasıdır.
Düzenleyici ve tarayıcı arasında sürekli geçiş yapmak, gün boyunca iş akışınıza bilişsel yük ekler. Bir ortamdan diğerine (geliştirme modundan hata ayıklama moduna) geçersiniz ve geri dönmeniz gerekir. Bu geri bildirim, geliştirici araçlarını bir uzantıya yerleştirmeyi keşfetmemize neden oldu, böylece kodunuzun ne ürettiğini görmenize ve "geliştirme" zihniyetinizden ayrılmadan hata ayıklamanıza izin verdi.
Uzantılar, ana ürüne ek yük eklemeden isteğe bağlı olarak daha fazla işlevsellik eklemenin harika bir yoludur. Kullanıcılarımızın geri bildirimlerine göre hızlı hareket etmemize ve yinelememize izin veriyorlar ve Microsoft Edge araçlarını VS Code'a getirmek için doğal bir seçimdi.

Yeni başsız ve tam tarayıcı modları

Yeni Microsoft Edge Tools uzantısı, iş akışınızı basitleştirmek ve daha fazla aracı entegre etmek için bir dizi değişiklikle birlikte gelir.
Bu sürümle, hata ayıklamak için bir Microsoft Edge örneğini başlatma şeklinizi değiştirdik. Mevcut bir tarayıcı örneğine bağlanmayı, yeni bir tane başlatmayı veya "başsız" bir tarayıcı kullanmayı seçebilirsiniz. "Başsız" seçeneği, tarayıcıyı başlatmanın daha az müdahaleci bir yoludur. Kendi tarayıcı pencereniz ve görev çubuğunuzda fazladan bir simgeniz yok. Bu, uzantının tarayıcı pencerelerinin ön planda etkin olmadığını bildirdiği için Mac kullanıcıları ile uzun süredir devam eden bir sorunu da çözdü. Yeni tarayıcı örneklerinin başsız olmasını isteyip istemediğinizi uzantı ayarlarında seçebilirsiniz.
"Başsız" seçeneği işaretli VSCode uzantı seçenekleri
Aşağıdaki ekran görüntülerinde farkı görebilirsiniz. Normal modda, etkileşim kurabileceğiniz tam bir tarayıcı penceresi alırsınız. Uzantıda bunun bir önizlemesini de görebilirsiniz.
Uzantıyı tam tarayıcı modunda kullanma
Uzantıyı tam tarayıcı modunda kullanma
Başsız modda, tarayıcı ayrı bir pencerede açılmaz:
Başsız modda bir tarayıcı kullanarak uzantı
Uzantıyı başsız modda kullanma

Ağ bölmesine giriş

Ağ bölmesi, Microsoft Edge DevTools'ta en çok kullanılan ikinci özelliktir, bu nedenle geçen yıl Ağ bölmesini VSCode'a entegre etmek için ayrı bir bağımsız uzantı yayınladık. Deneyimde kafa karıştırıcı yinelemelere neden olan geri bildirimler duyduk, bu nedenle bu sürümle iki uzantıyı tek bir uzantıda birleştiriyoruz; artık uzantı ayarlarında Ağ sekmesini de etkinleştirebilirsiniz.
VS Code uzantısı için Edge Devtools'daki ağ sekmesi
VS Code uzantısı için Edge Devtools'daki ağ sekmesi
Bu deneyim hakkında geliştiricilerden haber almak için sabırsızlanıyoruz. Şimdilik, Ağ bölmesini varsayılan olarak kapalı bırakıyoruz, ancak varsayılan olarak Ağ bölmesini mi yoksa ek bölmeleri mi tercih edeceğiniz konusunda geri bildirim almayı çok isteriz.

Katkıda bulunmayı kolaylaştırmak

Katkıda bulunanlar, yeni uzantının çok daha hızlı oluşturulduğunu görecek ve daha kolay katkı sağlamak için mimariyi değiştirdik Geçmişte katkıda bulunmak için Chromium'un tamamını indirip oluşturmanız gerekiyordu, şimdi sizden yalnızca uzantı için ihtiyacınız olan parçaları almanızı istiyoruz ve süreci kolaylaştırmak için birkaç komut dosyası yazdık.

Katılın!

Fikirlerinizi dinlemek için buradayız ve başka neleri daha iyi yapabileceğimizi bilmek isteriz. Yeni uzantıyı bugün deneyin ve ne düşündüğünüzü bize bildirin!
Uzantı projesini GitHub'da da bulabilirsiniz Ekiple geri bildirim paylaşmanın en iyi yolu , orada bir sorun bildirmektir . Twitter'da @EdgeDevTools olarak da kullanılabiliriz Bu uzantıda başka neler görmek istediğinizi ve bundan sonra geliştirici araçlarının hangi kısımlarını eklememiz gerektiğini sizden duymak isteriz!

11.08.2021

Diğer Haberler

PlatinMarket® E-Ticaret Sistemi İle Hazırlanmıştır.