Azure Developer CLI için etkinleştirilen uygulamaları çalıştırma ve hatalarını ayıklama
Azure Geliştirici CLI'sıazd
() için Visual Studio Code uzantısını kullanarak yerel makinenizde uygulamaları çalıştırın ve hatalarını ayıklayın. Bu kılavuzda, Azure'da Node.js API ve MongoDB ile React Web App şablonunu kullanacaksınız. Bu makalede öğrendiğiniz ilkeleri Azure Geliştirici CLI şablonlarından herhangi birine uygulayabilirsiniz.
Önkoşullar
Azure Geliştirici CLI'sı için Visual Studio Code uzantısını yükleme
Visual Studio Code aracılığıyla
Visual Studio Code'u açın.
Görünüm menüsünde Uzantılar'ı seçin.
Arama alanına yazın
Azure Developer CLI
.Yükle'yi seçin.
Market aracılığıyla
Tarayıcınızı kullanarak Azure Geliştirici CLI - VS Code Uzantısı sayfasına gidin.
Yükle'yi seçin.
Yeni bir uygulama başlatma
Visual Studio Code'da yeni bir dizin oluşturun ve açın.
Görünüm menüsünden Komut Paleti... öğesini seçin.
yazın ve öğesini seçin
Azure Developer: init
.şablonunu
Azure-Samples/todo-nodejs-mongo
seçin.
Dizine eklenen .vscode
aşağıdaki dosyaları keşfedin:
Dosya | Açıklama |
---|---|
launch.json |
Hata Ayıklama Web ve Hata Ayıklama API'si gibi hata ayıklama yapılandırmalarını tanımlar. hata ayıklama yapılandırma seçeneklerini görmek için Görünüm menüsünde Çalıştır'ı seçin. Kullanılabilir hata ayıklama yapılandırmaları bölmenin en üstünde listelenir. Visual Studio Code'da hata ayıklama hakkında daha fazla bilgi edinmek için bkz . Hata Ayıklama. |
tasks.json |
Web veya API sunucusunu başlatmak için yapılandırmaları tanımlar. Bu yapılandırma seçeneklerini görmek için Komut Paleti'ni açın ve Görev: görevi çalıştır'ı çalıştırın. Visual Studio Code Görevleri hakkında daha fazla bilgi edinmek için bkz . Görevler aracılığıyla Dış Araçlarla Tümleştirme. |
Dekont
C# SWA-func MS SQL şablonunu kullanıyorsanız, API'yi Başlat görevini el ile başlatmanız ve ardından API Hatalarını Ayıklama (F5) yapmanız gerekir. Çalışan .NET işlemleri listesinden seçim yapmak istendiğinde, uygulamanızın adını arayın ve seçin.
Azure kaynaklarını hazırlama
Hata ayıklamaya başlamadan önce gerekli Azure kaynaklarını sağlayın.
Komut Paleti'ne tıklayın.
Azure Geliştirici: Azure kaynaklarını sağlama girin.
API'de hata ayıklama
Hata ayıklama yapılandırması Hata Ayıklama API'si , API sunucusunu otomatik olarak çalıştırır ve hata ayıklayıcısını ekler. Bu düzeni test etmek için aşağıdaki adımları uygulayın:
Projenizin
src/api/src/routes
dizininden dosyasını açınlists.ts
.16. satırda bir kesme noktası ayarlayın.
Etkinlik Çubuğu'nda Çalıştır ve Hata Ayıklama API'sinde> hata ayıklama yapılandırması >Hata Ayıklamayı Başlat okunu seçin.
Görünüm menüsünden Hata Ayıklama Konsolu'nu seçin.
Hata ayıklayıcının 3100 numaralı bağlantı noktasında dinlediğini belirten iletiyi bekleyin.
Tercih ettiğiniz terminal kabuğuna aşağıdaki komutu girin:
curl http://localhost:3100/lists
Daha önce ayarladığınız kesme noktasına isabet edildiğinde uygulama yürütme duraklatılır. Bu noktada, aşağıdakiler gibi standart hata ayıklama görevlerini gerçekleştirebilirsiniz:
- Değişkenleri inceleme
- Çağrı yığınına bakın
- Diğer kesme noktalarını ayarlayın.
Uygulamayı çalıştırmaya devam etmek için basın
<F5>
. Örnek uygulama boş bir liste döndürür.
React Ön Uç uygulamasında hata ayıklama
Hata Ayıklama Web yapılandırmasını kullanmak için her ikisini de başlatmanız gerekir:
- API sunucusu
- Geliştirme web sunucusu
Bu düzeni test etmek için aşağıdaki adımları uygulayın:
Komut Paleti'ni açın ve Görev: Görevi çalıştır'ı çalıştırın.
API'yi ve Web'i Başlat'ı girin ve seçin
Bir web tarayıcısında aşağıdaki URL'ye giderek yerel web sunucusunun çalışıp çalışmadığını de kontrol edebilirsiniz:
http://localhost:3000
.Projenizin
src/web/src/components
dizininde dosyasını açıntodoItemListPane.tsx
.150. satırda bir kesme noktası ayarlayın (işlevin
deleteItems
ilk satırı).Etkinlik Çubuğu'nda, Hata Ayıklamayı Başlat okunu Çalıştır ve Hata Ayıkla>Web hata ayıklama yapılandırması'nı > seçin.
Web uygulamasını çalıştırmak, varsayılan tarayıcınızın şu URL'yi açmasına neden olur:
http://localhost:3000
. Artık bir öğe ekleyerek, listeden seçerek ve Sil'i seçerek uygulamada hata ayıklayabilirsiniz.Daha önce ayarladığınız kesme noktasına isabet edildiğinde uygulama yürütme duraklatılır. Bu noktada, aşağıdakiler gibi standart hata ayıklama görevleri gerçekleştirebilirsiniz:
- Değişkenleri inceleme
- Çağrı yığınına bakın
- Diğer kesme noktalarını ayarlama
Uygulamayı çalıştırmaya devam etmek için basın
<F5>
; seçili öğe silinir.
Visual Studio ve Azure Geliştirici CLI'sı (azd
) kullanarak yerel makinenizde oluşturulan uygulamaları çalıştırın ve hatalarını ayıklayın. Bu kılavuzda Azure'da C# API ve MongoDB ile React Web App şablonunu kullanacaksınız. Bu makalede öğrendiğiniz ilkeleri Azure Geliştirici CLI şablonlarından herhangi birine uygulayabilirsiniz.
Önkoşullar
Önizleme özelliğini yükleme ve etkinleştirme
Visual Studio Preview'ı yükleme
Dekont
Bu, Visual Studio'dan farklıdır. Visual Studio'nun önizleme sürümüne sahip değilseniz, bunu yine de yüklemeniz gerekir.
Visual Studio Önizleme'yi açın.
Araçlar menüsünden Seçenekler>Önizleme Özellikleri'ni seçin.
Azure Geliştirici CLI'sı olan azd ile tümleştirmenin etkinleştirildiğinden emin olun.
API çözümünü açma
Todo.Api.sln
Çözümü dizininde/src/api
açın.Tümleştirme özelliğini etkinleştirdiyseniz
azd
dosyaazure.yaml
algılanır. Visual Studio, uygulama modelini otomatik olarak başlatır ve çalıştırırazd env refresh
.Tüm bağımlılıkları görmek için Bağlan Hizmetler'i genişletin.
Azure Uygulaması Hizmetinde çalışan web ön ucu API çözümünün bir parçası olmasa da algılanıp Hizmet Bağımlılıkları'nın altına eklenir
Çalıştırma ve hata ayıklama
Projenizin
src/api
dizininden dosyasını açınListController.cs
.20. satırda bir kesme noktası ayarlayın.
<F5>
işaretine basın.Web sunucusunun 3101 numaralı bağlantı noktasında dinlediğini belirten iletiyi bekleyin.
Tercih ettiğiniz tarayıcıya aşağıdaki adresi girin:
https://localhost:3101/lists
Daha önce ayarladığınız kesme noktasına isabet edildiğinde uygulama yürütme duraklatılır. Bu noktada, aşağıdakiler gibi standart hata ayıklama görevlerini gerçekleştirebilirsiniz:
- Değişkenleri inceleme
- Çağrı yığınına bakın
- Diğer kesme noktalarını ayarlama
Uygulamayı çalıştırmaya devam etmek için basın
<F5>
.Örnek uygulama, web ön ucunu daha önce başlatmadıysanız bir liste (veya boş bir liste [] döndürür):
[{"id":"fb9c1cb3811349b993421fc0e815c4c1","name":"My List","description":null,"createdDate":"2022-06-27T01:10:16.7721172+00:00","updatedDate":null}]
Diğer azd
tümleştirmeler
Ortamı yönetme azd
Ortamı yönetmek azd
için:
Hizmet Bağımlılıkları bölmesinin sağ üst köşesinde ... öğesini seçin.
Açılan menüde aşağıdaki seçeneklerden birini belirleyin:
- Yeni bir ortam oluşturun
- Belirli bir ortamı geçerli etkin ortam olarak seçme ve ayarlama
- Ortamın sağlamasını kaldırma
Ortam kaynaklarını sağlama
Ortamınıza Azure kaynakları sağlayabilirsiniz.
Bağlan ed Services'da, ortam kaynaklarını geri yüklemek/sağlamak için sağ üstteki simgeye tıklayın.
Ortam adını, aboneliği ve konumu onaylayın.
Uygulamanızı yayımlama
Herhangi bir güncelleştirme yaparsanız, aşağıdaki adımları uygulayarak uygulamanızı yayımlayabilirsiniz:
Çözüm Gezgini Bağlan Hizmetler'i genişletin.
Yayımla'yı seçin.
Yayımlama profili ekle'yi seçin.
Bir Azure hedefiseçin ve İleri'yi seçin.
Azure Geliştirici CLI Ortamı'nın ardından İleri'yi seçin.
Ortamı seçin.
Bitir'i seçin.
Diğer kaynaklar
Yardım isteme
Azure Geliştirici CLI'sı için hata oluşturma, yardım isteme veya yeni bir özellik önerme hakkında bilgi için lütfen sorun giderme ve destek sayfasını ziyaret edin.
Sonraki adımlar
Geri Bildirim
https://aka.ms/ContentUserFeedback.
Çok yakında: 2024 boyunca, içerik için geri bildirim mekanizması olarak GitHub Sorunları’nı kullanımdan kaldıracak ve yeni bir geri bildirim sistemiyle değiştireceğiz. Daha fazla bilgi için bkz.Gönderin ve geri bildirimi görüntüleyin