Membuat proyek Vue.js
Dalam pengenalan 5-10 menit ini ke lingkungan pengembangan terintegrasi Visual Studio (IDE), Anda membuat dan menjalankan aplikasi web frontend Vue.js sederhana.
Prasyarat
Pastikan untuk menginstal perangkat lunak berikut:
- Visual Studio 2022 atau yang lebih baru. Pergi ke halaman unduhan Visual Studio untuk menginstalnya secara gratis.
- npm (
https://www.npmjs.com/
), yang disertakan dengan Node.js - Vue.js (Penginstalan | Vue.js (vuejs.org))
Membuat aplikasi Anda
Di jendela Mulai (pilih File>Jendela Mulai untuk dibuka), pilih Buat proyek baru.
cuplikan layar
Cari Vue di bilah pencarian di bagian atas lalu pilih Vue App untuk JavaScript atau TypeScript.
cuplikan layar
Mulai dari Visual Studio 2022 Versi 11, nama templat diubah dari Proyek JavaScript Vue Mandiri menjadi Aplikasi Vue.
Beri nama proyek dan solusi Anda, lalu pilih Berikutnya.
Pilih Buat, lalu tunggu Visual Studio untuk membuat proyek.
Menampilkan properti proyek
Pengaturan proyek default memungkinkan Anda untuk membangun dan men-debug proyek. Tetapi, jika Anda perlu mengubah pengaturan, klik kanan proyek di Penjelajah Solusi, pilih Properti, lalu buka bagian Linting, Build, atau Penerapan.
Untuk konfigurasi debugger, gunakan launch.json.
Nota
launch.json
menyimpan pengaturan startup yang terkait dengan tombol Mulai di toolbar Debug. Saat ini, launch.json
harus berada di bawah folder .vscode
.
Bangun Proyek Anda
Pilih Build>Build Solution untuk menyusun proyek.
Memulai Proyek Anda
Tekan F5 atau pilih tombol Mulai di bagian atas jendela, dan Anda akan melihat prompt perintah seperti:
VITE v4.4.9 siap dalam 780 ms
Nota
Periksa output konsol untuk pesan, seperti pesan yang menginstruksikan Anda untuk memperbarui versi Node.js.
Selanjutnya, Anda akan melihat aplikasi Vue.js dasar muncul!
Langkah berikutnya
Untuk integrasi ASP.NET Core: