Membuat ekstensi Wizard Azure Data Studio

Tutorial ini menunjukkan cara membuat ekstensi Azure Data Studio Wizard baru. Ekstensi ini berkontribusi pada wizard untuk berinteraksi dengan pengguna di Azure Data Studio.

Di artikel ini, Anda akan mempelajari cara:

• Menginstal generator ekstensi
• Membuat ekstensi Anda
• Menambahkan wizard kustom ke ekstensi Anda
• Menguji ekstensi Anda
• Mengemas ekstensi Anda
• Menerbitkan ekstensi Anda ke marketplace

Prasyarat

Azure Data Studio dibangun pada kerangka kerja yang sama dengan Visual Studio Code, sehingga ekstensi untuk Azure Data Studio dibuat menggunakan Visual Studio Code. Untuk memulai, Anda memerlukan komponen berikut:

• Node.js terinstal dan tersedia di .$PATH Node.js mencakup npm, Node.js Package Manager, yang digunakan untuk menginstal generator ekstensi.
• Visual Studio Code untuk men-debug ekstensi.
• Ekstensi Debug Azure Data Studio (opsional). Ini memungkinkan Anda menguji ekstensi tanpa perlu mengemas dan menginstalnya ke Azure Data Studio.
• Pastikan azuredatastudio berada di jalur Anda. Untuk Windows, pastikan Anda memilih Add to Path opsi di setup.exe. Untuk Mac atau Linux, jalankan perintah Instal 'azuredatastudio' di PATH dari Palet Perintah di Azure Data Studio.

Menginstal generator ekstensi

Untuk menyederhanakan proses pembuatan ekstensi, kami telah membangun generator ekstensi menggunakan Yeoman. Untuk menginstalnya, jalankan hal berikut dari prompt perintah:

npm install -g yo generator-azuredatastudio

Membuat ekstensi wizard Anda

Pengantar wizard

Wizard adalah jenis antarmuka pengguna yang menyajikan halaman langkah demi langkah untuk diisi pengguna, untuk menyelesaikan tugas. Contoh umum termasuk wizard penyiapan perangkat lunak dan wizard pemecahan masalah. Contohnya:

Karena wizard sering kali membantu saat bekerja dengan data dan memperluas fungsionalitas Azure Data Studio, Azure Data Studio menawarkan API untuk membuat wizard kustom Anda sendiri. Kami akan menelusuri cara membuat templat Wizard dan memodifikasinya untuk membuat wizard kustom Anda sendiri.

Jalankan generator ekstensi

Untuk membuat ekstensi:

1. Luncurkan generator ekstensi dengan perintah berikut:

   yo azuredatastudio

2. Pilih Wizard atau Dialog Baru dari daftar tipe ekstensi. Lalu pilih Wizard, diikuti dengan Templat Memulai

3. Ikuti langkah-langkah untuk mengisi nama ekstensi (untuk tutorial ini, gunakan Ekstensi Pengujian Saya), dan tambahkan deskripsi.

   

Menyelesaikan langkah-langkah sebelumnya akan membuat folder baru. Buka folder di Visual Studio Code dan Anda siap untuk membuat ekstensi wizard Anda sendiri!

Jalankan ekstensi

Mari kita lihat apa yang diberikan templat wizard kepada kita dengan menjalankan ekstensi. Sebelum berjalan, pastikan ekstensi Debug Azure Data Studio diinstal di Visual Studio Code.

Pilih F5 di VISUAL Code untuk meluncurkan Azure Data Studio dalam mode debug dengan ekstensi berjalan. Kemudian, di Azure Data Studio, jalankan perintah Launch Wizard dari Palet Perintah (Ctr+Shift+P) di jendela baru. Ini akan meluncurkan wizard default yang dikontribusikan ekstensi ini:

Selanjutnya, kita akan melihat cara mengubah wizard default ini.

Mengembangkan wizard

File yang paling penting untuk memulai pengembangan ekstensi adalah package.json, , src/main.tsdan vsc-extension-quickstart.md:

• package.json: Ini adalah file manifes, tempat perintah Launch Wizard terdaftar. Di sinilah juga dinyatakan main.ts sebagai titik masuk program utama.
• main.ts: Berisi kode untuk menambahkan elemen UI ke Wizard, seperti halaman, teks, dan tombol
• vsc-extension-quickstart.md: Berisi dokumentasi teknis yang mungkin merupakan referensi bermanfaat saat mengembangkan

Mari kita buat perubahan pada wizard: kita akan menambahkan halaman kosong ke-4. Ubah src/main.ts seperti yang ditunjukkan di bawah ini, dan Anda akan melihat halaman tambahan muncul saat Anda meluncurkan wizard.

Setelah Anda terbiasa dengan templat, berikut adalah beberapa ide tambahan untuk dicoba:

• Tambahkan tombol dengan lebar 300 ke halaman baru Anda
• Tambahkan komponen fleksibel untuk memasukkan tombol Anda
• Tambahkan tindakan ke tombol Anda. Misalnya, saat tombol diklik, luncurkan dialog pembukaan file atau buka editor kueri.

Mengemas ekstensi Anda

Untuk berbagi dengan orang lain, Anda perlu mengemas ekstensi ke dalam satu file. Ini dapat diterbitkan ke marketplace ekstensi Azure Data Studio, atau dibagikan di antara tim atau komunitas Anda. Untuk melakukan ini, Anda perlu menginstal paket npm lain dari baris perintah:

npm install -g vsce

README.md Edit sesuai keinginan Anda, lalu navigasikan ke direktori dasar ekstensi, dan jalankan vsce package. Anda dapat secara opsional menautkan repositori dengan ekstensi Anda atau melanjutkan tanpa repositori. Untuk menambahkannya, tambahkan baris serupa ke file Anda package.json .

"repository": {
    "type": "git",
    "url": "https://github.com/anjalia/my-test-extension.git"
}

Setelah baris ini ditambahkan, file my-test-extension-0.0.1.vsix dibuat dan siap diinstal di Azure Data Studio.

Menerbitkan ekstensi Anda ke marketplace

Marketplace ekstensi Azure Data Studio belum sepenuhnya diimplementasikan, tetapi proses saat ini adalah menghosting ekstensi VSIX di suatu tempat (misalnya, halaman Rilis GitHub) lalu mengirimkan PR yang memperbarui file JSON ini dengan info ekstensi Anda.

Langkah berikutnya

Dalam tutorial ini, Anda mempelajari cara:

• Menginstal generator ekstensi
• Membuat ekstensi Anda
• Menambahkan wizard kustom ke ekstensi Anda
• Menguji ekstensi Anda
• Mengemas ekstensi Anda
• Menerbitkan ekstensi Anda ke marketplace

Kami berharap setelah membaca ini, Anda akan terinspirasi untuk membangun ekstensi Anda sendiri untuk Azure Data Studio. Kami memiliki dukungan untuk Insight Dasbor (grafik cantik yang berjalan terhadap SQL Server Anda), sejumlah API khusus SQL, dan set besar titik ekstensi yang ada yang diwarisi dari Visual Studio Code.

Jika Anda memiliki ide tetapi tidak yakin cara memulai, silakan buka masalah atau tweet di tim: azuredatastudio.

Anda selalu dapat merujuk ke panduan ekstensi Visual Studio Code karena mencakup semua API dan pola yang ada.

Untuk mempelajari cara bekerja dengan T-SQL di Azure Data Studio, selesaikan tutorial Editor T-SQL:

Gunakan editor Transact-SQL untuk membuat objek database