Loading

Вайб-кодинг в vscode с Sonnet, Gemini, Grok, ChatGPT через continue и routerai.ru за рубли и без VPN.

В этой статье

Мы подробно разберем как подключить и использовать любые ИИ модели в vscode. В результате мы получим настроенного агента полностью понимающего весь контекст проекта. Вы сможете ставить задачу на естественном языке, а агент будет изменять код в виде diff, которые вы принимаете или отклоняете.

continue edit code

1. Введение: Continue в vscode. Собираем свой AI-сетап для разработки.

Еще пару лет назад использование ИИ в редакторе кода казалось магией, но сегодня если ты не используешь AI агентов в разработке то ты отстаешь. Мы давно привыкли к автодополнениям кода и проверке синтаксиса в IDE, но сегодня AI агенты способны искать и исправлять ошибки, создавать документацию и тесты и что самое главное они делают это в контексте проекта самостоятельно находя и изменяя нужные части кода.

В vscode встроен стандартный Copilot, но с ним все не так просто, остобенно если вы живете в России.

  1. Vendor Lock-in (Привязка к вендору): Copilot работает на моделях OpenAI. Но что, если для твоих задач лучше подходит Claude 4.5 Sonnet (который сейчас объективно лидирует в кодинге) или open-weight модель вроде Llama 3?
  2. Сложности с оплатой: Для разработчиков из РФ оплата зарубежных сервисов превратилась в квест с криптой и виртуальными картами.
  3. Цена и контроль: Подписка стоит фиксированных денег, даже если вы ушли в отпуск. К тому же, вы не контролируете, какие данные и куда отправляются.

Решение: Open Source + Агрегатор API

Мы можем собрать свой собственный, более гибкий и мощный аналог Copilot, используя два инструмента:

  1. Continue — open-source расширение для VS Code (и JetBrains), которое позволяет подключать любые LLM. Это не просто чат, а полноценный инструмент с автодополнением кода, inline-редактированием и контекстным пониманием проекта.
  2. RouterAI — провайдер API, который дает доступ к десяткам топовых нейросетей (GPT-5.1, Claude 4.5, Gemini 3.0, DeepSeek 3.1, Grok 4 и многим другим моделям) через единый интерфейс. Это решает проблему доступа к моделям без VPN и позволяет оплачивать только фактически использованные токены российскими картами.

В этой статье мы разберем, как за 5 минут превратить VS Code в мощную AI-станцию, настроить доступ к лучшим моделям мира и при этом не мучиться с зарубежными платежами.

2. Что такое Continue? Анатомия инструмента

Если упростить, Continue — это IDE-ассистент с открытым исходным кодом (Apache 2.0), который выступает в роли "фронтенда" для любой языковой модели. В отличие от проприетарных плагинов, где логика "зашита" вендором, Continue дает вам полный доступ к настройкам через config.json.

Это не просто чат сбоку. Инструмент закрывает три основных сценария работы разработчика:

  1. Чат (Sidebar): Классический диалог для вопросов "Как это работает?" или "Напиши функцию".
  2. Inline Edit (Редактирование): Вы нажимаете Cmd+I (или Ctrl+I), пишете промпт прямо в коде, и нейросеть правит выделенный фрагмент, показывая diff (разницу) перед принятием изменений.
  3. Tab Autocomplete (Автодополнение): "Призрачный текст", который появляется, пока вы печатаете. Работает аналогично Copilot, но модель под капотом выбираете вы.

Киллер-фича: Провайдеры контекста

Главная проблема обычного ChatGPT в браузере — он ничего не знает о вашем проекте. Вам приходится вручную копипастить куски кода.

Continue решает это через Context Providers. Плагин индексирует вашу рабочую директорию, позволяя "скармливать" модели именно то, что нужно для решения задачи. Прямо в чате вы можете использовать специальные ссылки:

  • @File — выбрать конкретные файлы для контекста.
  • @Codebase — плагин использует embeddings для смыслового поиска по всему проекту (RAG), чтобы найти релевантные куски кода для ответа.
  • @Docs — подключить внешнюю документацию (например, React, AWS, Stripe), которую модель изучит перед генерацией ответа.
  • @Terminal — отправить в чат последние строки логов или вывода ошибки.

Итог: Continue — это оркестратор. Он берет ваш код, добавляет контекст, отправляет всё это в LLM и красиво отображает результат в VS Code. А вот какая именно LLM будет отвечать — зависит от нас. И здесь нам поможет RouterAI.

3. RouterAI: получаем ключ ко всем моделям

Чтобы Continue заработал, ему нужен доступ к "мозгам" — LLM-провайдеру. В оригинале плагин предлагает использовать API OpenAI, Anthropic или запускать модели локально (Ollama).

Мы пойдем по пути использования RouterAI. По сути, это API-шлюз, который агрегирует доступ к сотням моделей. Благодоря такому подходу мы не ограничены одним поставщиком и можем выбирать модели в зависимости от задачи, цены или просто для сравнения результатов. И самое главное RouterAI работает за рубли и доступен из России.

Почему именно он?

  1. Единый формат (OpenAI Compatible): Для приложения это выглядит как обычный OpenAI API. Это значит, что RouterAI можно встроить почти в любой инструмент, который поддерживает ChatGPT, просто подменив Base URL.
  2. Доступ без VPN: Вам доступны Claude 4.5 Sonnet (топ-1 для кода на данный момент), GPT-5.1, модели от Google, Grok, DeepSeek и многих других без необходимости включать VPN.
  3. Оплата: Работает с российскими картами и СБП, доступна оплата по счету. Модель оплаты — Pay-as-you-go (платишь только за токены).
  4. Командные аккауты: позволяют объединять пользователей в команды. Это позволяет вести один счет для многих сотрудников, гибко контролировать расходы и лимиты, просматривать статистику команды и отдельных участников.

Алгоритм действий:

  1. Переходим на RouterAI.
  2. Регистрируемся (почта или через VK, Yandex).
  3. Пополняем баланс на любую сумму для теста (обычно 500 рублей хватит надолго, если не использовать самые дорогие модели).
  4. Переходим в раздел Ключи AP и создаем новый ключ.
    • Важно: Скопируйте ключ (он начинается на sk-...) сразу, больше его не покажут.
  5. Ключ понадобится нам на следующем этапе при конфигурации continue.

Совет: На RouterAI есть список доступных моделей который ежедневно пополняется, здесь вы сможете найти подходящую именно вам. Например anthropic/claude-sonnet-4.5, x-ai/grok-4, deepseek/deepseek-chat-v3.1 и другие)

4. Техническая часть: Установка и Настройка

Сама установка расширения проста и показана по шагам: находим Continue в VS Code Marketplace и жмем Install. После установки на левой панели появится иконка расширения (цифра 4 на скриншоте).

continue install

Самое интересное происходит под капотом. Continue управляется через файл конфигурации config.yaml.
Чтобы открыть его:

  1. Нажмите на значок шестеренки (Settings) в нижнем правом углу панели Continue.
  2. Открывшемся окне жмем на Configs
  3. И снова на шестеренку возле Local Config

continue config

Настройка моделей

Итак у нас открылся файл config.yaml. Я приведу пример моего конфига с самыми популярными моделями на данный момент, вам останется только подставить свой ключ от RouterAI.

По аналогии вы легко сможете добавить любые новые модели.


name: Local Assistant
version: 1.0.0
schema: v1
models:
  - name: Claude Sonnet 4.5
    provider: openai
    model: anthropic/claude-sonnet-4.5
    apiKey: ВАШ_API_КЛЮЧ_ROUTERAI
    apiBase: https://routerai.ru/api/v1

  - name: Claude Haiku 4.5
    provider: openai
    model: anthropic/claude-haiku-4.5
    apiKey: ВАШ_API_КЛЮЧ_ROUTERAI
    apiBase: https://routerai.ru/api/v1

  - name: Gemini 3 Pro Preview
    provider: openai
    model: google/gemini-3-pro-preview
    apiKey: ВАШ_API_КЛЮЧ_ROUTERAI
    apiBase: https://routerai.ru/api/v1

  - name: DeepSeek V3.1
    provider: openai
    model: deepseek/deepseek-chat-v3.1
    apiKey: ВАШ_API_КЛЮЧ_ROUTERAI
    apiBase: https://routerai.ru/api/v1

  - name: Grok 4
    provider: openai
    model: x-ai/grok-4
    apiKey: ВАШ_API_КЛЮЧ_ROUTERAI
    apiBase: https://routerai.ru/api/v1

  - name: Qwen3 Max
    provider: openai
    model: qwen/qwen3-max
    apiKey: ВАШ_API_КЛЮЧ_ROUTERAI
    apiBase: https://routerai.ru/api/v1

  - name: GPT-5.1 Chat
    provider: openai
    model: openai/gpt-5.1-chat
    apiKey: ВАШ_API_КЛЮЧ_ROUTERAI
    apiBase: https://routerai.ru/api/v1

context:
  - provider: code
  - provider: docs
  - provider: diff
  - provider: terminal
  - provider: problems
  - provider: folder
  - provider: codebase
  - provider: tree
  - provider: repo-map

Разбор параметров:

  •  name— Название которое отображается при выборе агента.
  • provider: "openai" — Используем этот провайдер для всех моделей, даже для моделей Anthropic, так как RouterAI транслирует запросы в формат OpenAI.
  • model — Идентификатор модели, выбирайте любую в RouterAI (например anthropic/claude-4.5-sonnet).
  • apiKey — Ваш API-ключ от RouterAI.
  • apiBase — Эндпоинт RouterAI, куда плагин отправляет запросы, всегда https://routerai.ru/api/v1.

Теперь мы можем выбрать любую из добавленных в конфиг моделей, а так же нам доступно 3 режима работы с моделью.

  • Chat - режим в котором вы общаетесь с моделью как в веб чате. Вы задаете вопрос и получаете ответ.
  • Plan - режим в котором модель предложит вам план решения вашей задачи и конкретные изменения.
  • Agent - режим в котором модель предложит вам план решения и покажет diff изменений для каждого файла и предложит их принять. В этом режиме разработкой занимается модель, а вы ставите задачи и принимаете результат, либо вносите корректировки.

Для максимального результата, я рекомендую использовать модель Claude Sonnet в режиме Agent

continue chat

5. Workflow: Как это работает на практике

Настройка завершена. Теперь у вас в VS Code живет мощный ИИ. Разберем основные сценарии использования, чтобы выжимать из инструмента максимум.

А. Умный чат с контекстом (Cmd/Ctrl + L)

Для того чтобы передать контекст прямо в чате наберите @, и увидите список источников данных. Мы подробно разберем их в следующей статье. Но я чаще всего использую @Entire codebase он предоставит continue структуру всех файлов проекта. Так агенту будет проще найти нужный файл контент которого он считает для решения задачи.

  • Кейс: Добавление фильтра в админу

    • Действие: Открываете чат
    • Промпт: "@Entire codebase Добавь в админку возможность поиска пользователей по email"
    • Результат: Continue просканирует нужные файлы вашего проекта и выдаст ответ со ссылками на конкретные файлы. Это то, чего так не хватает в веб-версии ChatGPT.

Continue admin filterНа скриншоте промт и первый предложенный Diff.

  • Кейс: Поиск по проекту (RAG).

    • Действие: Открываете чат
    • Промпт: "@Entire codebase Где у находится логика валидации токенов и как её переиспользовать?"
    • Результат: Continue просканирует нужные файлы вашего проекта и выдаст ответ со ссылками на конкретные файлы. Это то, чего так не хватает в веб-версии ChatGPT.

Так же Вы можете выделить любой кусок кода в редакторе и нажать Cmd + L (macOS) или Ctrl + L (Windows/Linux). Выделенный код автоматически попадет в окно чата.

  • Кейс: Разбор чужого кода.

    • Действие: Выделяете непонятную функцию -> Cmd+L.
    • Промпт: "Объясни, что делает этот код и найди в нем потенциальные баги".
    • Результат: Модель анализирует конкретные строки.

Б. Inline Edit: Рефакторинг на лету (Cmd/Ctrl + I)

Вам не обязательно переключаться в чат, копировать код туда-сюда.

  1. Выделите функцию или класс.
  2. Нажмите Cmd + I.
  3. Появится строка ввода прямо над кодом.
  4. Напишите задачу, например: "Добавь обработку ошибок try-catch".

В чем киллер-фича: Continue не просто перепишет код, он покажет Diff. Вы увидите удаленные строки красным, а новые — зеленым. Можно нажать Accept (Принять) или Reject (Отклонить). Это дает полный контроль и страхует от галлюцинаций модели.

6. Нюансы работы

Важно понимать механику работы LLM. У моделей есть "окно контекста", и каждый раз, когда вы отправляете новый вопрос в текущий чат, плагин отправляет модели всю историю переписки плюс все приложенные файлы.

Это создает две проблемы:

  1. Снижение качества (Шум): Если полчаса назад вы обсуждали верстку CSS, а теперь просите оптимизировать SQL-запрос в том же чате, "внимание" модели размывается. Старые инструкции могут конфликтовать с новыми, вызывая галлюцинации или игнорирование свежих требований.
  2. Перерасход бюджета: Входящие токены (Input tokens) стоят денег. Если ваш чат разросся до 20 000 токенов, то даже простой вопрос "А как назвать переменную?" будет дорогим. Вы будете платить за повторную отправку старой истории снова и снова.

Главаное правило: New Task = New Chat

Возьмите за привычку регулярно сбрасывать контекст.

  • Закончили фичу? Нажмите на плюсик в Continue (начинает новый сеанс).
  • Сменили контекст задачи? (например, переключились с бэкенда на фронтенд) — новый сеанс.
  • Модель начала "тупить"? Не пытайтесь ее переубедить в длинной ветке. Проще открыть новый чат, скинуть нужный кусок кода и задать вопрос с чистого листа.

Такой подход («Short-lived sessions») не только экономит ваш баланс в RouterAI, но и держит ответы модели максимально точными и релевантными, так как в "оперативной памяти" нейросети находится только то, что нужно для текущей секунды работы.

Стоимость каждого запроса, а так же расходы по моделям за нужный период вы можете отслеживать на странице статистики в RouterAI.

7. Заключение: Свобода выбора

В результате мы собрали не просто "бесплатный аналог Copilot", а гораздо более гибкий и мощный инструмент. Связка VS Code + Continue + RouterAI дает вам преимущество, которого нет у пользователей коробочных решений:

  1. Доступ к Top-Tier моделям: Вы пишете код с помощью Claude 4.5 Sonnet (который сейчас объективно считается лидером в кодинге), в то время как пользователи стандартного GitHub Copilot зачастую привязаны к версиям GPT, выбранным Microsoft.
  2. Финансовая гибкость: Вы платите только за использованые токены выбранной вами модели.
  3. Никакого Vendor Lock-in: Вышла новая крутая модель от Google или DeepSeek? Вам не нужно ждать обновления плагина полгода. Вы просто меняете название модели в config.yaml и тестируете новинку через 5 минут.
  4. Работа без VPN: Gateway-решение снимает головную боль с доступом к API из РФ.
  5. Оплата в рублях: Пополняйте счет картами РФ или со счета организации.

Главный сдвиг, который происходит с использованием Continue — это исчезновение барьера между редактором и нейросетью. Эра "Copy-Paste Driven Development" (копирования кода в браузер и обратно) уходит в прошлое. Теперь ИИ живет там, где ему и место — прямо в вашем редакторе, понимая контекст ваших файлов, папок и документации.

Попробуйте выделить вечер на настройку этого сетапа. Уверяю что после первых удачных рефакторингов  возвращаться к "пустому" редактору вам уже не захочется.

Приятного кодинга! 🚀