Visual Studio Code

​

Ekstensi VS Code (Beta)

Ekstensi VS Code, tersedia dalam beta, memungkinkan Anda melihat perubahan Claude secara real-time melalui antarmuka grafis native yang terintegrasi langsung ke dalam IDE Anda. Ekstensi VS Code membuat lebih mudah untuk mengakses dan berinteraksi dengan Claude Code bagi pengguna yang lebih suka antarmuka visual daripada terminal.

​

Fitur

Ekstensi VS Code menyediakan:

• Pengalaman IDE native: Panel sidebar Claude Code khusus yang diakses melalui ikon Spark
• Mode rencana dengan pengeditan: Tinjau dan edit rencana Claude sebelum menerimanya
• Mode penerimaan otomatis editan: Terapkan perubahan Claude secara otomatis saat dibuat
• Manajemen file: Sebutkan file dengan @ atau lampirkan file dan gambar menggunakan pemilih file sistem
• Penggunaan server MCP: Gunakan server Model Context Protocol yang dikonfigurasi melalui CLI
• Riwayat percakapan: Akses mudah ke percakapan masa lalu
• Sesi ganda: Jalankan beberapa sesi Claude Code secara bersamaan
• Pintasan keyboard: Dukungan untuk sebagian besar pintasan dari CLI
• Perintah slash: Akses sebagian besar perintah slash CLI langsung di ekstensi

​

Persyaratan

• VS Code 1.98.0 atau lebih tinggi

​

Instalasi

Unduh dan instal ekstensi dari Visual Studio Code Extension Marketplace.

​

Cara Kerjanya

Setelah diinstal, Anda dapat mulai menggunakan Claude Code melalui antarmuka VS Code:

1. Klik ikon Spark di sidebar editor Anda untuk membuka panel Claude Code
2. Prompt Claude Code dengan cara yang sama seperti di terminal
3. Tonton saat Claude menganalisis kode Anda dan menyarankan perubahan
4. Tinjau dan terima editan langsung di antarmuka
   • Tip: Seret sidebar lebih lebar untuk melihat inline diffs, kemudian klik pada mereka untuk memperluas detail lengkap

​

Menggunakan Penyedia Pihak Ketiga (Vertex dan Bedrock)

Ekstensi VS Code mendukung penggunaan Claude Code dengan penyedia pihak ketiga seperti Amazon Bedrock dan Google Vertex AI. Ketika dikonfigurasi dengan penyedia ini, ekstensi tidak akan meminta login. Untuk menggunakan penyedia pihak ketiga, konfigurasikan variabel lingkungan di pengaturan ekstensi VS Code:

1. Buka pengaturan VS Code
2. Cari “Claude Code: Environment Variables”
3. Tambahkan variabel lingkungan yang diperlukan

​

Variabel Lingkungan

Untuk instruksi setup terperinci dan opsi konfigurasi tambahan, lihat:

• Claude Code di Amazon Bedrock
• Claude Code di Google Vertex AI

​

Belum Diimplementasikan

Fitur berikut belum tersedia di ekstensi VS Code:

• Konfigurasi server MCP lengkap: Anda perlu mengonfigurasi server MCP melalui CLI terlebih dahulu, kemudian ekstensi akan menggunakannya
• Konfigurasi subagents: Konfigurasikan subagents melalui CLI untuk menggunakannya di VS Code
• Checkpoints: Simpan dan pulihkan status percakapan pada titik tertentu
• Pintasan lanjutan:
  • Pintasan # untuk menambahkan ke memori
  • Pintasan ! untuk menjalankan perintah bash secara langsung
• Penyelesaian tab: Penyelesaian jalur file dengan tombol tab

Kami sedang mengerjakan penambahan fitur-fitur ini dalam pembaruan mendatang.

​

Pertimbangan Keamanan

Ketika Claude Code berjalan di VS Code dengan izin auto-edit diaktifkan, mungkin dapat memodifikasi file konfigurasi IDE yang dapat dijalankan secara otomatis oleh IDE Anda. Ini mungkin meningkatkan risiko menjalankan Claude Code dalam mode auto-edit dan memungkinkan melewati prompt izin Claude Code untuk eksekusi bash. Saat berjalan di VS Code, pertimbangkan:

• Mengaktifkan VS Code Restricted Mode untuk workspace yang tidak dipercaya
• Menggunakan mode persetujuan manual untuk editan
• Berhati-hati ekstra untuk memastikan Claude hanya digunakan dengan prompt yang dipercaya

​

Integrasi CLI Warisan

Integrasi VS Code pertama yang kami rilis memungkinkan Claude Code yang berjalan di terminal untuk berinteraksi dengan IDE Anda. Ini menyediakan berbagi konteks seleksi (seleksi/tab saat ini secara otomatis dibagikan dengan Claude Code), tampilan diff di IDE daripada terminal, pintasan referensi file (Cmd+Option+K di Mac atau Alt+Ctrl+K di Windows/Linux untuk menyisipkan referensi file seperti @File#L1-99), dan berbagi diagnostik otomatis (lint dan kesalahan sintaks). Integrasi warisan auto-install ketika Anda menjalankan claude dari terminal terintegrasi VS Code. Cukup jalankan claude dari terminal dan semua fitur diaktifkan. Untuk terminal eksternal, gunakan perintah /ide untuk menghubungkan Claude Code ke instans VS Code Anda. Untuk mengonfigurasi, jalankan claude, masukkan /config, dan atur alat diff ke auto untuk deteksi IDE otomatis. Baik ekstensi maupun integrasi CLI bekerja dengan Visual Studio Code, Cursor, Windsurf, dan VSCodium.

​

Pemecahan Masalah

​

Ekstensi Tidak Terinstal

• Pastikan Anda memiliki versi VS Code yang kompatibel (1.85.0 atau lebih baru)
• Periksa bahwa VS Code memiliki izin untuk menginstal ekstensi
• Coba instal langsung dari situs web marketplace

​

Integrasi Warisan Tidak Berfungsi

• Pastikan Anda menjalankan Claude Code dari terminal terintegrasi VS Code
• Pastikan CLI untuk varian IDE Anda diinstal:
  • VS Code: perintah code harus tersedia
  • Cursor: perintah cursor harus tersedia
  • Windsurf: perintah windsurf harus tersedia
  • VSCodium: perintah codium harus tersedia
• Jika perintah tidak diinstal:
  1. Buka palet perintah dengan Cmd+Shift+P (Mac) atau Ctrl+Shift+P (Windows/Linux)
  2. Cari “Shell Command: Install ‘code’ command in PATH” (atau setara untuk IDE Anda)

Untuk bantuan tambahan, lihat panduan pemecahan masalah kami.