Claude Code для VS Code: Посібник з використання

Claude Code — це інструмент Agentic Coding, розроблений компанією Anthropic, який також відомий як один з найпотужніших програмних агентів у світі. Розширення Claude Code для VS Code надає рідний графічний інтерфейс, підтримує вбудований перегляд Diff, посилання з @-згадками, планування оглядів та інші функції, що робить його рекомендованим способом використання Claude Code у VS Code. Цей документ в основному описує, як налаштувати та використовувати розширення Claude Code у VS Code через проксі-сервіс AceData Cloud.

Процес подачі заявки

Щоб використовувати Claude Code, спочатку перейдіть на сторінку сервісу Claude Messages і натисніть кнопку «Acquire», щоб отримати необхідні облікові дані для запиту:

Якщо ви ще не увійшли в систему або не зареєстровані, вас автоматично перенаправлять на сторінку входу, щоб запросити реєстрацію та вхід. Після входу або реєстрації ви будете автоматично повернені на цю сторінку. При першій подачі заявки вам буде надано безкоштовний ліміт, щоб ви могли безкоштовно випробувати послуги Claude Code.

Встановлення плагіна

Системні вимоги

VS Code 1.98.0 або новішої версії (також підтримується Cursor)

Кроки установки

У розділі розширень VS Code / Cursor натисніть Cmd+Shift+X (Mac) або Ctrl+Shift+X (Windows/Linux), щоб відкрити перегляд розширень, знайдіть Claude Code, знайдіть плагін, випущений компанією Anthropic, і натисніть «Install»: Плагін Claude Code у VS Code Marketplace

Плагін Claude Code у VS Code Marketplace

Також можна встановити безпосередньо за наступними посиланнями:

Після установки виберіть довіру в спливаючому повідомленні, щоб завершити установку.

Якщо після установки розширення не з’явилося, перезавантажте VS Code або виконайте в командній панелі «Developer: Reload Window».

Налаштування AceData Cloud API

При першому відкритті плагіна з’явиться запит на вхід до офіційного облікового запису Anthropic. Ми можемо пропустити офіційний вхід, налаштувавши проксі API AceData Cloud для використання, без необхідності офіційної підписки.

Крок 1: Налаштування змінних середовища

Ви можете вибрати будь-яке з наступних місць для налаштування змінних середовища: Варіант A: Налаштування на рівні користувача (підходить для всіх проектів) Редагуйте ~/.claude/settings.json (якщо не існує, створіть), додайте конфігурацію env, замінивши {token} на ваш API токен, отриманий у консолі AceData Cloud:

{
  "env": {
    "ANTHROPIC_AUTH_TOKEN": "{token}",
    "ANTHROPIC_BASE_URL": "https://api.acedata.cloud"
  }
}

Варіант B: Налаштування на рівні проекту (тільки для поточного проекту) У кореневій директорії проекту створіть .claude/settings.json (спільна конфігурація) або .claude/settings.local.json (особиста конфігурація, gitignored):

{
  "env": {
    "ANTHROPIC_AUTH_TOKEN": "{token}",
    "ANTHROPIC_BASE_URL": "https://api.acedata.cloud"
  }
}

Порада: API токен можна переглянути в консолі AceData Cloud. Значення ANTHROPIC_AUTH_TOKEN буде автоматично додано з префіксом Bearer при відправці на сервер. Налаштування на рівні проекту має вищий пріоритет, ніж на рівні користувача. Рекомендується використовувати спільну конфігурацію .claude/settings.json для командних проектів, а особисту чутливу інформацію зберігати в .claude/settings.local.json.

Крок 2: Вимкнення запиту на вхід (необов’язково)

Якщо ви не хочете щоразу бачити запит на вхід, ви можете у налаштуваннях VS Code відзначити Disable Login Prompt: У налаштуваннях знайдіть «Claude Code login», знайдіть опцію Disable Login Prompt та відзначте її. Після завершення налаштування знову відкрийте панель плагіна Claude Code, щоб почати нормальне використання.

Відкриття панелі Claude Code

Після установки та налаштування є кілька способів відкрити Claude Code:

Спосіб	Дія
Панель інструментів редактора	Натисніть на значок ✦ Spark у правому верхньому куті редактора (потрібно відкрити файл)
Статусна панель	Натисніть на «✱ Claude Code» праворуч у нижній статусній панелі (не потрібно відкривати файл)
Командна панель	`Cmd+Shift+P` / `Ctrl+Shift+P`, знайдіть «Claude Code»
Гарячі клавіші	`Cmd+Esc` (Mac) / `Ctrl+Esc` (Windows/Linux) для перемикання фокусу

На відміну від таких інструментів, як Cursor / Copilot, які використовують бокову панель, Claude Code за замовчуванням використовує перегляд редактора як область чату, що забезпечує більшу видиму площу та більш багатий показ вмісту. Ви також можете перетягнути панель на бокову панель або в інше місце. Панель Claude Code у VS Code

Основне використання

Діалогова взаємодія

У панелі Claude Code просто введіть природну мову, щоб взаємодіяти з Claude. Наприклад:

«Допоможи мені проаналізувати загальну архітектуру цього проекту»
«У цьому коді є помилка, допоможи мені виправити»
«Перепиши цю функцію, щоб підвищити читабельність»
«Напиши юніт-тест для цього модуля»

Claude Code автоматично зрозуміє контекст вашої кодової бази, аналізуючи та редагуючи між файлами. Коли Claude потрібно внести зміни у файл, з’явиться перегляд Diff, де ви можете вибрати прийняти або відхилити зміни. Діалог та підказки Claude Code у VS Code

Діалог та підказки Claude Code у VS Code

Контекстні посилання

У діалозі використовуйте символ @, щоб посилатися на конкретні файли або контекст:

@filename.py — посилання на вказаний файл (підтримує нечітке співпадіння)
@src/components/ — посилання на цілу директорію (потрібен слеш в кінці)
@terminal:name — посилання на вивід терміналу

Вибравши код у редакторі, натисніть Option+K (Mac) / Alt+K (Windows/Linux), щоб швидко вставити посилання @ (наприклад, @app.ts#5-10).

Команди зі слешем

Натисніть на значок / у діалоговому вікні або просто введіть /, щоб скористатися багатьма вбудованими функціями: Звичайні команди включають:

Команда	Функція
`/new`	Створити новий діалог
`/model`	Переключити модель
`/compact`	Стиснути контекст
`/mcp`	Налаштувати MCP сервіс
`/config`	Відкрити налаштування
`/usage`	Переглянути використання
`/memory`	Керувати пам’яттю Claude
`/help`	Показати довідкову інформацію

Перегляд історії діалогів

Натисніть на випадаюче меню вгорі панелі, щоб переглянути історію діалогів, підтримується пошук за ключовими словами та перегляд за часовими періодами (Сьогодні, Вчора, Останні 7 днів тощо), що полегшує повернення до попередніх взаємодій. Натисніть на будь-який діалог, щоб відновити повну історію повідомлень.

Огляд змін коду

Коли Claude потрібно внести зміни у файл, з’явиться перегляд Diff, що демонструє порівняння оригінального коду та зміненого. Ви можете вибрати прийняти або відхилити кожну зміну, а також повідомити Claude про бажані альтернативи: VS Code в режимі порівняння Diff

Режими доступу

За допомогою індикатора режиму внизу панелі можна перемикатися між різними режимами доступу:

Режим	Опис
За замовчуванням (Запит)	Запит на підтвердження перед кожною операцією (за замовчуванням)
План	Claude спочатку складає план, чекає на затвердження, після підтвердження виконує
прийнятиРедагування	Автоматично приймає редагування файлів, але команди терміналу все ще потребують підтвердження
обійтиДоступи	Пропускає всі запити на доступ, повна автоматизація (використовувати обережно)

Паралельні сесії

Використовуючи командну панель, можна запустити кілька незалежних діалогів за допомогою Відкрити в новій вкладці або Відкрити в новому вікні, кожен діалог підтримує власну історію та контекст, що дозволяє паралельно виконувати різні завдання.

Інші налаштування

Перемикання моделей

Claude Code підтримує перемикання між різними моделями, такими як Claude Sonnet, Claude Opus тощо. Це можна налаштувати за допомогою команди /model або в налаштуваннях плагіна в Вибрана модель.

Автоматичний режим

У налаштуваннях плагіна можна встановити Початковий режим доступу на обійтиДоступи, після чого Claude Code виконуватиме редагування файлів, команди терміналу та інші операції без підтвердження вікон, реалізуючи повністю автоматизований робочий процес. Також можна встановити на прийнятиРедагування, щоб реалізувати автоматичне прийняття редагувань, але команди терміналу все ще потребують підтвердження в напівавтоматичному режимі.

Увага: Перед увімкненням автоматичного режиму переконайтеся, що ви розумієте його ризики, рекомендується використовувати в надійних проектних середовищах.

Використання CLI в терміналі

Якщо ви більше віддаєте перевагу командному рядку, можна в налаштуваннях VS Code вибрати Використовувати термінал, Claude Code працюватиме в режимі CLI в інтегрованому терміналі. Ви також можете безпосередньо відкрити інтегрований термінал VS Code і виконати команду claude.

Поширені запитання

Що робити, якщо з’єднання не вдалося?

Переконайтеся, що в ~/.claude/settings.json або .claude/settings.json правильно налаштовані змінні середовища, особливо ANTHROPIC_AUTH_TOKEN та ANTHROPIC_BASE_URL
Переконайтеся, що API токен дійсний (можна перевірити в консолі)
Перевірте, чи нормально працює мережеве з’єднання, переконайтеся, що ви можете отримати доступ до https://api.acedata.cloud
Перезапустіть VS Code і спробуйте ще раз

Чому не з’явився значок Spark?

Переконайтеся, що ви відкрили файл (лише відкриття папки недостатньо)
Переконайтеся, що версія VS Code 1.98.0 або вище
Виконайте в командній панелі «Розробник: Перезавантажити вікно»
Або просто натисніть на значок «✱ Claude Code» в нижній панелі стану

Як перевірити залишок квоти?

Увійдіть в консолі AceData Cloud, щоб переглянути залишок квоти та використання вашого облікового запису.

Дізнайтеся більше

📖 Офіційна документація Claude Code для VS Code
⌨️ Посилання на команди та гарячі клавіші VS Code
🔧 Служба Claude Code AceData Cloud
💬 Якщо у вас є будь-які питання, будь ласка, зв’яжіться з нами через службу підтримки платформи

​Процес подачі заявки

​Встановлення плагіна

​Системні вимоги

​Кроки установки

​Налаштування AceData Cloud API

​Крок 1: Налаштування змінних середовища

​Крок 2: Вимкнення запиту на вхід (необов’язково)

​Відкриття панелі Claude Code

​Основне використання

​Діалогова взаємодія

​Контекстні посилання

​Команди зі слешем

​Перегляд історії діалогів

​Огляд змін коду

​Режими доступу

​Паралельні сесії

​Інші налаштування

​Перемикання моделей

​Автоматичний режим

​Використання CLI в терміналі

​Поширені запитання

​Що робити, якщо з’єднання не вдалося?

​Чому не з’явився значок Spark?

​Як перевірити залишок квоти?

​Дізнайтеся більше