
Prasyarat
- VS Code 1.98.0 atau lebih tinggi
- Akun Anthropic (Anda akan masuk saat pertama kali membuka ekstensi). Jika Anda menggunakan penyedia pihak ketiga seperti Amazon Bedrock atau Google Vertex AI, lihat Gunakan penyedia pihak ketiga sebagai gantinya.
Instal ekstensi
Klik tautan untuk IDE Anda untuk menginstal secara langsung: Atau di VS Code, tekanCmd+Shift+X (Mac) atau Ctrl+Shift+X (Windows/Linux) untuk membuka tampilan Ekstensi, cari “Claude Code”, dan klik Instal.
Jika ekstensi tidak muncul setelah instalasi, restart VS Code atau jalankan “Developer: Reload Window” dari Command Palette.
Mulai
Setelah diinstal, Anda dapat mulai menggunakan Claude Code melalui antarmuka VS Code:Buka panel Claude Code
Di seluruh VS Code, ikon Spark menunjukkan Claude Code:
Cara tercepat untuk membuka Claude adalah dengan mengklik ikon Spark di Editor Toolbar (sudut kanan atas editor). Ikon hanya muncul saat Anda memiliki file terbuka.
Cara lain untuk membuka Claude Code:

- Command Palette:
Cmd+Shift+P(Mac) atauCtrl+Shift+P(Windows/Linux), ketik “Claude Code”, dan pilih opsi seperti “Open in New Tab” - Status Bar: Klik ✱ Claude Code di sudut kanan bawah jendela. Ini berfungsi bahkan saat tidak ada file yang terbuka.
Kirim prompt
Minta Claude untuk membantu dengan kode atau file Anda, baik itu menjelaskan cara kerja sesuatu, men-debug masalah, atau membuat perubahan.Berikut adalah contoh menanyakan tentang baris tertentu dalam file:

Gunakan kotak prompt
Kotak prompt mendukung beberapa fitur:- Mode izin: Klik indikator mode di bagian bawah kotak prompt untuk beralih mode. Dalam mode normal, Claude meminta izin sebelum setiap tindakan. Dalam Plan Mode, Claude menjelaskan apa yang akan dilakukan dan menunggu persetujuan sebelum membuat perubahan. Dalam mode auto-accept, Claude membuat edit tanpa bertanya. Atur default di pengaturan VS Code di bawah
claudeCode.initialPermissionMode. - Menu perintah: Klik
/atau ketik/untuk membuka menu perintah. Opsi termasuk melampirkan file, beralih model, mengalihkan extended thinking, dan melihat penggunaan rencana (/usage). Bagian Customize menyediakan akses ke MCP servers, hooks, memory, permissions, dan plugins. Item dengan ikon terminal terbuka di terminal terintegrasi. - Indikator konteks: Kotak prompt menunjukkan berapa banyak context window Claude yang Anda gunakan. Claude secara otomatis melakukan auto-compact saat diperlukan, atau Anda dapat menjalankan
/compactsecara manual. - Extended thinking: Memungkinkan Claude menghabiskan lebih banyak waktu untuk bernalar melalui masalah kompleks. Alihkan melalui menu perintah (
/). Lihat Extended thinking untuk detail. - Input multi-baris: Tekan
Shift+Enteruntuk menambahkan baris baru tanpa mengirim. Ini juga berfungsi di input teks bebas “Other” dari dialog pertanyaan.
Referensikan file dan folder
Gunakan @-mentions untuk memberikan Claude konteks tentang file atau folder tertentu. Saat Anda mengetik@ diikuti nama file atau folder, Claude membaca konten tersebut dan dapat menjawab pertanyaan tentangnya atau membuat perubahan padanya. Claude Code mendukung fuzzy matching, jadi Anda dapat mengetik nama parsial untuk menemukan apa yang Anda butuhkan:
Option+K (Mac) / Alt+K (Windows/Linux) untuk menyisipkan @-mention dengan jalur file dan nomor baris (misalnya, @app.ts#5-10). Klik indikator pilihan untuk mengalihkan apakah Claude dapat melihat teks yang disorot Anda - ikon eye-slash berarti pilihan tersembunyi dari Claude.
Anda juga dapat menahan Shift sambil menyeret file ke kotak prompt untuk menambahkannya sebagai lampiran. Klik X pada lampiran apa pun untuk menghapusnya dari konteks.
Lanjutkan percakapan masa lalu
Klik dropdown di bagian atas panel Claude Code untuk mengakses riwayat percakapan Anda. Anda dapat mencari berdasarkan kata kunci atau menelusuri berdasarkan waktu (Hari Ini, Kemarin, 7 hari terakhir, dll.). Klik percakapan apa pun untuk melanjutkannya dengan riwayat pesan lengkap. Untuk lebih lanjut tentang melanjutkan sesi, lihat Alur kerja umum.Lanjutkan sesi jarak jauh dari Claude.ai
Jika Anda menggunakan Claude Code di web, Anda dapat melanjutkan sesi jarak jauh tersebut langsung di VS Code. Ini memerlukan masuk dengan Claude.ai Subscription, bukan Anthropic Console.Pilih tab Remote
Dialog menampilkan dua tab: Local dan Remote. Klik Remote untuk melihat sesi dari claude.ai.
Hanya sesi web yang dimulai dengan repositori GitHub yang muncul di tab Remote. Melanjutkan memuat riwayat percakapan secara lokal; perubahan tidak disinkronkan kembali ke claude.ai.
Sesuaikan alur kerja Anda
Setelah Anda siap dan berjalan, Anda dapat memposisikan ulang panel Claude, menjalankan beberapa sesi, atau beralih ke mode terminal.Pilih di mana Claude berada
Anda dapat menyeret panel Claude untuk memposisikan ulang di mana saja di VS Code. Ambil tab atau bilah judul panel dan seret ke:- Secondary sidebar: Sisi kanan jendela. Membuat Claude tetap terlihat saat Anda coding.
- Primary sidebar: Sidebar kiri dengan ikon untuk Explorer, Search, dll.
- Editor area: Membuka Claude sebagai tab di samping file Anda. Berguna untuk tugas sampingan.
Jalankan beberapa percakapan
Gunakan Open in New Tab atau Open in New Window dari Command Palette untuk memulai percakapan tambahan. Setiap percakapan mempertahankan riwayat dan konteksnya sendiri, memungkinkan Anda bekerja pada tugas berbeda secara paralel. Saat menggunakan tab, titik berwarna kecil pada ikon spark menunjukkan status: biru berarti permintaan izin tertunda, oranye berarti Claude selesai saat tab tersembunyi.Beralih ke mode terminal
Secara default, ekstensi membuka panel chat grafis. Jika Anda lebih suka antarmuka gaya CLI, buka pengaturan Use Terminal dan centang kotak. Anda juga dapat membuka pengaturan VS Code (Cmd+, di Mac atau Ctrl+, di Windows/Linux), buka Extensions → Claude Code, dan centang Use Terminal.
Kelola plugins
Ekstensi VS Code mencakup antarmuka grafis untuk menginstal dan mengelola plugins. Ketik/plugins di kotak prompt untuk membuka antarmuka Manage plugins.
Instal plugins
Dialog plugin menampilkan dua tab: Plugins dan Marketplaces. Di tab Plugins:- Installed plugins muncul di bagian atas dengan tombol toggle untuk mengaktifkan atau menonaktifkannya
- Available plugins dari marketplace yang dikonfigurasi muncul di bawah
- Cari untuk memfilter plugins berdasarkan nama atau deskripsi
- Klik Install pada plugin yang tersedia apa pun
- Install for you: Tersedia di semua proyek Anda (user scope)
- Install for this project: Dibagikan dengan kolaborator proyek (project scope)
- Install locally: Hanya untuk Anda, hanya di repositori ini (local scope)
Kelola marketplace
Beralih ke tab Marketplaces untuk menambah atau menghapus sumber plugin:- Masukkan repo GitHub, URL, atau jalur lokal untuk menambahkan marketplace baru
- Klik ikon refresh untuk memperbarui daftar plugin marketplace
- Klik ikon trash untuk menghapus marketplace
Manajemen plugin di VS Code menggunakan perintah CLI yang sama di balik layar. Plugins dan marketplace yang Anda konfigurasi di ekstensi juga tersedia di CLI, dan sebaliknya.
Otomatisasi tugas browser dengan Chrome
Hubungkan Claude ke browser Chrome Anda untuk menguji aplikasi web, debug dengan console logs, dan otomatisasi alur kerja browser tanpa meninggalkan VS Code. Ini memerlukan ekstensi Claude in Chrome versi 1.0.36 atau lebih tinggi. Ketik@browser di kotak prompt diikuti dengan apa yang ingin Anda lakukan Claude:
Perintah dan pintasan VS Code
Buka Command Palette (Cmd+Shift+P di Mac atau Ctrl+Shift+P di Windows/Linux) dan ketik “Claude Code” untuk melihat semua perintah VS Code yang tersedia untuk ekstensi Claude Code.
Beberapa pintasan bergantung pada panel mana yang “focused” (menerima input keyboard). Saat kursor Anda berada di file kode, editor difokuskan. Saat kursor Anda berada di kotak prompt Claude, Claude difokuskan. Gunakan Cmd+Esc / Ctrl+Esc untuk beralih di antara keduanya.
Ini adalah perintah VS Code untuk mengontrol ekstensi. Tidak semua perintah Claude Code bawaan tersedia di ekstensi. Lihat Ekstensi VS Code vs. Claude Code CLI untuk detail.
| Perintah | Pintasan | Deskripsi |
|---|---|---|
| Focus Input | Cmd+Esc (Mac) / Ctrl+Esc (Windows/Linux) | Alihkan fokus antara editor dan Claude |
| Open in Side Bar | - | Buka Claude di sidebar kiri |
| Open in Terminal | - | Buka Claude dalam mode terminal |
| Open in New Tab | Cmd+Shift+Esc (Mac) / Ctrl+Shift+Esc (Windows/Linux) | Buka percakapan baru sebagai tab editor |
| Open in New Window | - | Buka percakapan baru di jendela terpisah |
| New Conversation | Cmd+N (Mac) / Ctrl+N (Windows/Linux) | Mulai percakapan baru (memerlukan Claude difokuskan) |
| Insert @-Mention Reference | Option+K (Mac) / Alt+K (Windows/Linux) | Sisipkan referensi ke file saat ini dan pilihan (memerlukan editor difokuskan) |
| Show Logs | - | Lihat log debug ekstensi |
| Logout | - | Keluar dari akun Anthropic Anda |
Konfigurasi pengaturan
Ekstensi memiliki dua jenis pengaturan:- Extension settings di VS Code: Kontrol perilaku ekstensi dalam VS Code. Buka dengan
Cmd+,(Mac) atauCtrl+,(Windows/Linux), kemudian buka Extensions → Claude Code. Anda juga dapat mengetik/dan memilih General Config untuk membuka pengaturan. - Claude Code settings di
~/.claude/settings.json: Dibagikan antara ekstensi dan CLI. Gunakan untuk perintah yang diizinkan, variabel lingkungan, hooks, dan MCP servers. Lihat Settings untuk detail.
Pengaturan ekstensi
| Pengaturan | Default | Deskripsi |
|---|---|---|
selectedModel | default | Model untuk percakapan baru. Ubah per-sesi dengan /model. |
useTerminal | false | Luncurkan Claude dalam mode terminal alih-alih panel grafis |
initialPermissionMode | default | Kontrol prompt persetujuan: default (tanya setiap kali), plan, acceptEdits, atau bypassPermissions |
preferredLocation | panel | Di mana Claude terbuka: sidebar (kanan) atau panel (tab baru) |
autosave | true | Auto-save file sebelum Claude membaca atau menulisnya |
useCtrlEnterToSend | false | Gunakan Ctrl/Cmd+Enter alih-alih Enter untuk mengirim prompt |
enableNewConversationShortcut | true | Aktifkan Cmd/Ctrl+N untuk memulai percakapan baru |
hideOnboarding | false | Sembunyikan daftar periksa onboarding (ikon graduation cap) |
respectGitIgnore | true | Kecualikan pola .gitignore dari pencarian file |
environmentVariables | [] | Atur variabel lingkungan untuk proses Claude. Gunakan pengaturan Claude Code sebagai gantinya untuk konfigurasi bersama. |
disableLoginPrompt | false | Lewati prompt autentikasi (untuk setup penyedia pihak ketiga) |
allowDangerouslySkipPermissions | false | Lewati semua prompt izin. Gunakan dengan sangat hati-hati. |
claudeProcessWrapper | - | Jalur executable yang digunakan untuk meluncurkan proses Claude |
Ekstensi VS Code vs. Claude Code CLI
Claude Code tersedia sebagai ekstensi VS Code (panel grafis) dan CLI (command-line interface di terminal). Beberapa fitur hanya tersedia di CLI. Jika Anda memerlukan fitur CLI-only, jalankanclaude di terminal terintegrasi VS Code.
| Fitur | CLI | Ekstensi VS Code |
|---|---|---|
| Perintah dan skills | Semua | Subset (ketik / untuk melihat yang tersedia) |
| Konfigurasi MCP server | Ya | Tidak (konfigurasi via CLI, gunakan di ekstensi) |
| Checkpoints | Ya | Ya |
Pintasan bash ! | Ya | Tidak |
| Tab completion | Ya | Tidak |
Rewind dengan checkpoints
Ekstensi VS Code mendukung checkpoints, yang melacak edit file Claude dan memungkinkan Anda rewind ke status sebelumnya. Arahkan ke pesan apa pun untuk mengungkapkan tombol rewind, kemudian pilih dari tiga opsi:- Fork conversation from here: mulai cabang percakapan baru dari pesan ini sambil menjaga semua perubahan kode tetap utuh
- Rewind code to here: kembalikan perubahan file ke titik ini dalam percakapan sambil menjaga riwayat percakapan lengkap
- Fork conversation and rewind code: mulai cabang percakapan baru dan kembalikan perubahan file ke titik ini
Jalankan CLI di VS Code
Untuk menggunakan CLI sambil tetap berada di VS Code, buka terminal terintegrasi (Ctrl+` di Windows/Linux atau Cmd+` di Mac) dan jalankan claude. CLI secara otomatis terintegrasi dengan IDE Anda untuk fitur seperti tampilan diff dan berbagi diagnostik.
Jika menggunakan terminal eksternal, jalankan /ide di dalam Claude Code untuk menghubungkannya ke VS Code.
Beralih antara ekstensi dan CLI
Ekstensi dan CLI berbagi riwayat percakapan yang sama. Untuk melanjutkan percakapan ekstensi di CLI, jalankanclaude --resume di terminal. Ini membuka picker interaktif di mana Anda dapat mencari dan memilih percakapan Anda.
Sertakan output terminal dalam prompt
Referensikan output terminal dalam prompt Anda menggunakan@terminal:name di mana name adalah judul terminal. Ini memungkinkan Claude melihat output perintah, pesan kesalahan, atau log tanpa copy-pasting.
Pantau proses latar belakang
Saat Claude menjalankan perintah yang berjalan lama, ekstensi menampilkan kemajuan di status bar. Namun, visibilitas untuk tugas latar belakang terbatas dibandingkan dengan CLI. Untuk visibilitas yang lebih baik, minta Claude menampilkan perintah sehingga Anda dapat menjalankannya di terminal terintegrasi VS Code.Hubungkan ke alat eksternal dengan MCP
MCP (Model Context Protocol) servers memberikan Claude akses ke alat eksternal, database, dan API. Konfigurasi melalui CLI, kemudian gunakan di ekstensi dan CLI. Untuk menambahkan MCP server, buka terminal terintegrasi (Ctrl+` atau Cmd+`) dan jalankan:
claude di terminal, kemudian ketik /mcp untuk autentikasi. Lihat dokumentasi MCP untuk server yang tersedia.
Bekerja dengan git
Claude Code terintegrasi dengan git untuk membantu dengan alur kerja kontrol versi langsung di VS Code. Minta Claude untuk commit perubahan, membuat pull request, atau bekerja di seluruh branch.Buat commit dan pull request
Claude dapat stage perubahan, menulis pesan commit, dan membuat pull request berdasarkan pekerjaan Anda:Gunakan git worktrees untuk tugas paralel
Git worktrees memungkinkan beberapa sesi Claude Code bekerja pada branch terpisah secara bersamaan, masing-masing dengan file terisolasi:Gunakan penyedia pihak ketiga
Secara default, Claude Code terhubung langsung ke API Anthropic. Jika organisasi Anda menggunakan Amazon Bedrock, Google Vertex AI, atau Microsoft Foundry untuk mengakses Claude, konfigurasi ekstensi untuk menggunakan penyedia Anda sebagai gantinya:Nonaktifkan prompt login
Buka pengaturan Disable Login Prompt dan centang kotak.Anda juga dapat membuka pengaturan VS Code (
Cmd+, di Mac atau Ctrl+, di Windows/Linux), cari “Claude Code login”, dan centang Disable Login Prompt.Konfigurasi penyedia Anda
Ikuti panduan setup untuk penyedia Anda:Panduan ini mencakup konfigurasi penyedia Anda di
~/.claude/settings.json, yang memastikan pengaturan Anda dibagikan antara ekstensi VS Code dan CLI.Keamanan dan privasi
Kode Anda tetap pribadi. Claude Code memproses kode Anda untuk memberikan bantuan tetapi tidak menggunakannya untuk melatih model. Untuk detail tentang penanganan data dan cara opt out dari logging, lihat Data and privacy. Dengan izin auto-edit diaktifkan, Claude Code dapat memodifikasi file konfigurasi VS Code (sepertisettings.json atau tasks.json) yang mungkin dijalankan VS Code secara otomatis. Untuk mengurangi risiko saat bekerja dengan kode yang tidak dipercaya:
- Aktifkan VS Code Restricted Mode untuk workspace yang tidak dipercaya
- Gunakan mode persetujuan manual alih-alih auto-accept untuk edit
- Tinjau perubahan dengan hati-hati sebelum menerimanya
Perbaiki masalah umum
Ekstensi tidak akan diinstal
- Pastikan Anda memiliki versi VS Code yang kompatibel (1.98.0 atau lebih baru)
- Periksa bahwa VS Code memiliki izin untuk menginstal ekstensi
- Coba instal langsung dari VS Code Marketplace
Ikon Spark tidak terlihat
Ikon Spark muncul di Editor Toolbar (kanan atas editor) saat Anda memiliki file terbuka. Jika Anda tidak melihatnya:- Buka file: Ikon memerlukan file untuk dibuka. Hanya membuka folder tidak cukup.
- Periksa versi VS Code: Memerlukan 1.98.0 atau lebih tinggi (Help → About)
- Restart VS Code: Jalankan “Developer: Reload Window” dari Command Palette
- Nonaktifkan ekstensi yang bertentangan: Sementara nonaktifkan ekstensi AI lainnya (Cline, Continue, dll.)
- Periksa kepercayaan workspace: Ekstensi tidak berfungsi dalam Restricted Mode
Cmd+Shift+P / Ctrl+Shift+P) dan ketik “Claude Code”.
Claude Code tidak pernah merespons
Jika Claude Code tidak merespons prompt Anda:- Periksa koneksi internet Anda: Pastikan Anda memiliki koneksi internet yang stabil
- Mulai percakapan baru: Coba mulai percakapan segar untuk melihat apakah masalah berlanjut
- Coba CLI: Jalankan
claudedari terminal untuk melihat apakah Anda mendapatkan pesan kesalahan yang lebih terperinci
Uninstal ekstensi
Untuk menguninstal ekstensi Claude Code:- Buka tampilan Ekstensi (
Cmd+Shift+Xdi Mac atauCtrl+Shift+Xdi Windows/Linux) - Cari “Claude Code”
- Klik Uninstall
Langkah berikutnya
Sekarang Anda telah menyiapkan Claude Code di VS Code:- Jelajahi alur kerja umum untuk mendapatkan hasil maksimal dari Claude Code
- Siapkan MCP servers untuk memperluas kemampuan Claude dengan alat eksternal. Konfigurasi server menggunakan CLI, kemudian gunakan di ekstensi.
- Konfigurasi pengaturan Claude Code untuk menyesuaikan perintah yang diizinkan, hooks, dan lainnya. Pengaturan ini dibagikan antara ekstensi dan CLI.
