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 memudahkan akses dan interaksi dengan Claude Code untuk pengguna yang lebih menyukai 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 auto-accept edits: Otomatis menerapkan perubahan Claude saat dibuat
- Manajemen file: @-mention file 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 sebelumnya
- Beberapa sesi: 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.Memperbarui
Untuk memperbarui ekstensi VS Code:- Buka command palette VS Code dengan
Cmd+Shift+P
(Mac) atauCtrl+Shift+P
(Windows/Linux) - Cari “Claude Code: Update”
- Pilih perintah untuk memperbarui ke versi terbaru
Cara Kerja
Setelah terinstal, Anda dapat mulai menggunakan Claude Code melalui antarmuka VS Code:- Klik ikon Spark di sidebar editor Anda untuk membuka panel Claude Code
- Prompt Claude Code dengan cara yang sama seperti di terminal
- Saksikan Claude menganalisis kode Anda dan menyarankan perubahan
- Tinjau dan terima edit langsung di antarmuka
- Tips: Seret sidebar lebih lebar untuk melihat diff inline, lalu klik untuk memperluas detail lengkap
Belum Diimplementasikan
Fitur-fitur berikut belum tersedia di ekstensi VS Code:- Konfigurasi server MCP lengkap: Anda perlu mengkonfigurasi server MCP melalui CLI terlebih dahulu, kemudian ekstensi akan menggunakannya
- Konfigurasi subagents: Konfigurasi 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 langsung
- Pintasan
- Tab completion: Penyelesaian jalur file dengan tombol tab
Pertimbangan Keamanan
Ketika Claude Code berjalan di VS Code dengan izin auto-edit diaktifkan, ia mungkin dapat memodifikasi file konfigurasi IDE yang dapat dieksekusi secara otomatis oleh IDE Anda. Ini dapat 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 edit
- Berhati-hati ekstra untuk memastikan Claude hanya digunakan dengan prompt yang dipercaya
Integrasi CLI Legacy
Integrasi VS Code pertama yang kami rilis memungkinkan Claude Code yang berjalan di terminal berinteraksi dengan IDE Anda. Ini menyediakan berbagi konteks seleksi (seleksi/tab saat ini secara otomatis dibagikan dengan Claude Code), tampilan diff di IDE alih-alih 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 legacy auto-install ketika Anda menjalankan claude
dari terminal terintegrasi VS Code. Cukup jalankan claude
dari terminal dan semua fitur akan aktif. Untuk terminal eksternal, gunakan perintah /ide
untuk menghubungkan Claude Code ke instance VS Code Anda. Untuk mengkonfigurasi, jalankan claude
, masukkan /config
, dan atur diff tool ke auto
untuk deteksi IDE otomatis.
Baik ekstensi maupun integrasi CLI bekerja dengan Visual Studio Code, Cursor, Windsurf, dan VSCodium.
Pemecahan Masalah
Ekstensi Tidak Menginstal
- 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 Legacy Tidak Bekerja
- Pastikan Anda menjalankan Claude Code dari terminal terintegrasi VS Code
- Pastikan CLI untuk varian IDE Anda terinstal:
- VS Code: perintah
code
harus tersedia - Cursor: perintah
cursor
harus tersedia - Windsurf: perintah
windsurf
harus tersedia - VSCodium: perintah
codium
harus tersedia
- VS Code: perintah
- Jika perintah tidak terinstal:
- Buka command palette dengan
Cmd+Shift+P
(Mac) atauCtrl+Shift+P
(Windows/Linux) - Cari “Shell Command: Install ‘code’ command in PATH” (atau yang setara untuk IDE Anda)
- Buka command palette dengan