Not
Bu sayfaya erişim yetkilendirme gerektiriyor. Oturum açmayı veya dizinleri değiştirmeyi deneyebilirsiniz.
Bu sayfaya erişim yetkilendirme gerektiriyor. Dizinleri değiştirmeyi deneyebilirsiniz.
Visual Studio tümleşik geliştirme ortamına (IDE) bu 5-10 dakikalık girişte basit bir Vue.js web uygulaması oluşturacak ve çalıştıracaksınız.
Önkoşullar
Visual Studio'yu ve Node.js geliştirme iş yükünü yüklemiş olmanız gerekir.
Visual Studio 2019'u henüz yüklemediyseniz, ücretsiz yüklemek için Visual Studio indirmeleri sayfasına gidin.
İş yükünü yüklemeniz gerekiyorsa ancak Zaten Visual Studio'nuz varsa Araçlar>Araçları ve Özellikleri Al...'e gidin. Bu, Visual Studio Yükleyicisi'ni açar. Node.js geliştirme iş yükünü ve ardından Değiştir'i seçin.
Node.js çalışma zamanının yüklü olması gerekir.
Yüklü değilse, dış çerçeveler ve kitaplıklarla en iyi uyumluluk için Node.js web sitesinden LTS sürümünü yüklemenizi öneririz. Node.js 32 bit ve 64 bit mimariler için tasarlanmıştır. Node.js iş yüküne dahil olan Visual Studio'daki Node.js araçları her iki sürümü de destekler. Yalnızca bir tane gereklidir ve Node.js yükleyicisi aynı anda yalnızca bir yükleyicinin yüklenmesini destekler.
Genel olarak, Visual Studio yüklü Node.js çalışma zamanını otomatik olarak algılar. Yüklü bir çalışma zamanını algılamazsa, projenizi özellikler sayfasında yüklü çalışma zamanına başvuracak şekilde yapılandırabilirsiniz (proje oluşturduktan sonra proje düğümüne sağ tıklayın, Özellikler'i seçin ve Node.exe yolunu ayarlayın). Node.js genel yüklemesini kullanabilir veya Node.js projelerinizin her birinde yerel yorumlayıcının yolunu belirtebilirsiniz.
Proje oluştur
İlk olarak bir Vue.js web uygulaması projesi oluşturacaksınız.
Node.js çalışma zamanı zaten yüklü değilse Node.js web sitesinden LTS sürümünü yükleyin.
Daha fazla bilgi için önkoşullara bakın.
Visual Studio'yu açın.
Yeni bir proje oluşturma.
Başlangıç penceresini kapatmak için esc
basın. Arama kutusunu açmak için Ctrl + Q yazın, Temel Vue.jsyazın, ardından Temel Vue.js Web uygulaması (JavaScript veya TypeScript) seçeneğini belirleyin. Görüntülenen iletişim kutusuna basic-vuejs adını yazın ve Oluştur'u seçin. 
Temel Vue.js Web uygulaması proje şablonunu görmüyorsanız Node.js geliştirme iş yükünü eklemeniz gerekir. Ayrıntılı yönergeler için bkz. Önkoşullar.
Visual Studio yeni projeyi oluşturur. Yeni proje Çözüm Gezgini'nde (sağ bölme) açılır.
Uygulama için gereken npm paketlerini yükleme işleminin ilerleme durumu için Çıkış penceresini (alt bölme) denetleyin.
Çözüm Gezgini'nde npm düğümünü açın ve listelenen tüm npm paketlerinin yüklü olduğundan emin olun.
Eksik paketler varsa (ünlem işareti simgesi), npm düğümüne sağ tıklayıp Eksik npm Paketlerini Yükle'yi seçebilirsiniz.
IDE'yi keşfedin
Sağ bölmedeki Çözüm Gezgini'ne göz atın.
Yeni Proje iletişim kutusunda belirttiğiniz adı kullanarak projeniz kalın olarak vurgulanır. Diskteki proje klasörünüzde yer alan njsproj dosyası, bu projeyi temsil eder.
En üst düzeyde, varsayılan olarak projenizle aynı ada sahip olan bir çözüm bulunur. Çözüm, diskteki bir .sln dosyası ile temsil edilen ve bir veya daha fazla ilgili proje için bir kapsayıcıdır.
npm düğümü yüklü npm paketlerini gösterir. bir iletişim kutusu kullanarak npm paketlerini aramak ve yüklemek için npm düğümüne sağ tıklayabilirsiniz.
Npm paketlerini yüklemek veya komut isteminden Node.js komutları çalıştırmak istiyorsanız, proje düğümüne sağ tıklayın ve Komut İstemini Burada Aç'ı seçin.
Projeye .vue dosyası ekleme
Çözüm Gezgini'nde src/components klasörü gibi herhangi bir klasöre sağ tıklayıpYeni Öğe Ekle'yi> seçin.
Tüm öğe şablonlarını görmüyorsanız, Tüm Şablonları Gösteröğesini ve ardından öğe şablonunu seçin.
JavaScript Vue Tek Dosya Bileşeni veya TypeScript Vue Tek Dosya Bileşeni'ni seçin ve ekle'ye tıklayın.
Visual Studio yeni dosyayı projeye ekler.
Projeyi oluştur
Ardından, projeyi derlemek için Derleme>Çözümü Derle'yi seçin.
Derleme sonuçlarını görmek için Çıkış penceresini işaretleyin ve Çıkışı göster listesinden Oluştur'u seçin.
JavaScript Vue.js proje şablonu (ve TypeScript şablonunun eski sürümleri) bir derleme sonrası olayı yapılandırarak build npm betiğini kullanır. Bu ayarı değiştirmek istiyorsanız, Windows Gezgini'nden proje dosyasını (<projectname.njsproj>) açın ve şu kod satırını bulun:
<PostBuildEvent>npm run build</PostBuildEvent>
Uygulamayı çalıştırma
Uygulamayı çalıştırmak için Ctrl+F5 (veya Hata Ayıklama Olmadan Başlat>) tuşlarına basın.
Konsolunda Geliştirme Sunucusu Başlatılıyor iletisini görürsünüz.
Ardından uygulama bir tarayıcıda açılır.
Çalışan uygulamayı görmüyorsanız sayfayı yenileyin.
Web tarayıcısını kapatın.
Bu Hızlı Başlangıcı tamamladığınızdan dolayı tebrikler! Visual Studio IDE'yi Vue.jsile kullanma hakkında biraz bilgi edinmiş olduğunuzu umuyoruz. Özelliklerine daha ayrıntılı bir şekilde göz atmak isterseniz, içindekiler tablosunun Öğreticiler bölümünde yer alan bir öğreticiyle devam edin.