Claude Code Плагины для IDE

Вот отредактированный текст:

Интеграция Claude Code с IDE

Кроме того, что мы можем взаимодействовать с Claude Code из командной строки, для наших IDE систем, в которых мы работаем, тоже есть возможность встроить дополнительный плагин, который будет иметь поддержку Claude Code. На момент записи этого видео существует интеграция с двумя популярными IDE системами: Visual Studio Code и JetBrains IDE, такими как PhpStorm, WebStorm и так далее.

На странице документации Claude Code to IDE вы можете посмотреть инструкции, как это можно сделать. Есть инструкция для VS Code - это делается через интеграцию. И соответственно, для JetBrains, в которых можно установить специальный плагин.

Здесь даётся ссылка на этот плагин в документации. Вот таким образом выглядит этот плагин.

Возникает вопрос, зачем нам нужен плагин, когда мы можем работать, в принципе, без него. Всё точно так же работает. Дело в том, что плагин позволяет нам использовать дополнительный интерфейс для взаимодействия с IDE.

Преимущества плагина

Давайте я покажу, как это выглядит. Во-первых, у вас появляется возможность запускать его с помощью иконки. Допустим, у меня есть проект, в котором я работаю.

Какие у нас есть преимущества? Во-первых, плагин позволяет нам, когда он соединяется с IDE системой, видеть и задавать сразу же контекст, где мы находимся. Например, я кликну по этому файлу, и он говорит, что мы находимся в этой категории, и она автоматически попадает в контекст. Нам не нужно писать "найди файл category.html.twig, добавь туда что-то". Мы просто сразу пишем "исправь вот это". Не нужно уточнять, где это нужно исправить.

Это первое преимущество. Потом мы можем выделить какую-то строчку кода. Как вы видите, здесь у нас это уже попало в контекст. Одна линия выделена. Мы можем выделить большее количество линий - оно сразу попадает в контекст. Нам не нужно писать "найди вот этот кусок кода, сделай с ним что-то". У нас это автоматически находится в контексте, и мы можем это использовать.

Следующее преимущество - давайте я его продемонстрирую, как это работает. Например, я напишу "добавь сюда CSS класс test". Он начинает работу. Сейчас посмотрим, как он запросит изменения в этот файл. Обратите внимание, что показывается, как было и как станет.

Благодаря плагину этот функционал у нас доступен. Мы прямо в IDE системе видим изменения. Мы можем их применить либо отвергнуть. Допустим, применим эти изменения. Всё - у нас добавился этот класс.

Аналогично это работает и в редакторе VS Code. Если вы установите там интеграцию с Claude Code, вот такой принцип работы. Для этого и нужны эти плагины.

Хочу уточнить важный момент. На момент записи этого видео была небольшая трудность. Так как мы работаем с Claude Code в WSL в терминале подсистемы Linux для Windows, то не всегда получается пробросить порты, дать разрешение для доступа к портам, на которых работает наш Claude Code в Windows систему. PhpStorm работает в Windows системе, а Claude Code в подсистеме Linux для Windows.

Здесь у нас возникает проблема - иногда не получается соединиться. Особенно это может произойти после обновления. Как я решил эту задачу? Я зашёл в C:\Users\Дмитрий (мой текущий пользователь) и создал файл .wslconfig. В обычном текстовом редакторе можем мы его отредактировать.

Добавил здесь такую конструкцию: networkingMode=mirrored. Это позволяет нам отзеркалить порты, которые используются в WSL внутрь Windows системы. По крайней мере, мне это помогло. Как пишут разработчики, это немного небезопасно - таким образом открывать порты, но тем не менее это значительно упрощает конфигурацию системы.

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