Установка плагина Claude Code

Что вы сможете сделать после обучения

• Включить функцию проверки планов Plannotator в Claude Code
• Выбрать подходящий способ установки (система плагинов или ручной Hook)
• Проверить успешность установки
• Правильно настроить Plannotator в удаленной/Devcontainer среде

Ваша текущая проблема

При использовании Claude Code планы, созданные ИИ, можно читать только в терминале, что затрудняет точную проверку и обратную связь. Вы хотите:

• Визуализировать планы ИИ в браузере
• Вносить точные примечания в планы (удаление, замена, вставка)
• Дать ИИ чёткие инструкции по изменению за один раз

Когда использовать этот метод

Подходит для следующих сценариев:

• Вы впервые используете Claude Code + Plannotator
• Вам нужно переустановить или обновить Plannotator
• Вы хотите использовать в удаленной среде (SSH, Devcontainer, WSL)

Основная идея

Установка Plannotator состоит из двух частей:

1. Установка CLI команды: это основное время выполнения, отвечающее за запуск локального сервера и браузера
2. Настройка Claude Code: через систему плагинов или ручной Hook, чтобы Claude Code автоматически вызывал Plannotator при завершении плана

После установки, когда Claude Code вызывает ExitPlanMode, автоматически запускается Plannotator и открывается интерфейс проверки планов в браузере.

🎒 Подготовка перед началом

Предварительная проверка

• [ ] Установлен Claude Code 2.1.7 или выше (требуется поддержка Permission Request Hooks)
• [ ] Есть права на выполнение команд в терминале (Linux/macOS требует sudo или установки в домашний каталог)

Следуйте за мной

Шаг 1: Установка CLI команды Plannotator

Сначала установите инструмент командной строки Plannotator.

macOS / Linux / WSL

curl -fsSL https://plannotator.ai/install.sh | bash

Windows PowerShell

irm https://plannotator.ai/install.ps1 | iex

Windows CMD

curl -fsSL https://plannotator.ai/install.cmd -o install.cmd && install.cmd && del install.cmd

Вы должны увидеть: в терминале отображается прогресс установки, после завершения появляется сообщение plannotator {версия} installed to {путь установки}/plannotator

Контрольная точка ✅: выполните следующую команду для проверки установки:

macOS / Linux

which plannotator

Windows PowerShell

Get-Command plannotator

Windows CMD

where plannotator

Вы должны увидеть путь установки команды Plannotator, например /usr/local/bin/plannotator или $HOME/.local/bin/plannotator.

Шаг 2: Установка плагина в Claude Code

Откройте Claude Code и выполните следующие команды:

/plugin marketplace add backnotprop/plannotator
/plugin install plannotator@plannotator

Вы должны увидеть: сообщение об успешной установке плагина.

Важно: необходимо перезапустить Claude Code

После установки плагина необходимо перезапустить Claude Code, иначе Hooks не будут работать.

Шаг 3: Проверка установки

После перезапуска выполните следующую команду в Claude Code для проверки функции проверки кода:

/plannotator-review

Вы должны увидеть:

• Браузер автоматически открывает интерфейс проверки кода Plannotator
• В терминале отображается "Opening code review..." и ожидается ваша обратная связь

Если вы видите вышеуказанный вывод, поздравляю, установка прошла успешно!

Пояснение

Функция проверки планов автоматически запускается, когда Claude Code вызывает ExitPlanMode, нет необходимости вручную выполнять тестовую команду. Вы можете протестировать эту функцию при фактическом использовании режима планирования.

Шаг 4: (Опционально) Ручная установка Hook

Если вы не хотите использовать систему плагинов или вам нужно использовать в среде CI/CD, можно вручную настроить Hook.

Отредактируйте файл ~/.claude/settings.json (если файл не существует, создайте его), добавьте следующее содержимое:

{
  "hooks": {
    "PermissionRequest": [
      {
        "matcher": "ExitPlanMode",
        "hooks": [
          {
            "type": "command",
            "command": "plannotator",
            "timeout": 1800
          }
        ]
      }
    ]
  }
}

Описание полей:

• matcher: "ExitPlanMode" - запускается, когда Claude Code вызывает ExitPlanMode
• command: "plannotator" - выполняет установленную CLI команду Plannotator
• timeout: 1800 - время ожидания (30 минут), даёт вам достаточно времени для проверки плана

Контрольная точка ✅: после сохранения файла перезапустите Claude Code, затем выполните /plannotator-review для тестирования.

Шаг 5: (Опционально) Настройка удаленной/Devcontainer среды

Если вы используете Claude Code в удаленной среде, такой как SSH, Devcontainer или WSL, вам нужно установить переменные окружения для фиксации порта и отключения автоматического открытия браузера.

Выполните в удаленной среде:

export PLANNOTATOR_REMOTE=1
export PLANNOTATOR_PORT=9999  # выберите порт, к которому вы будете обращаться через перенаправление портов

Эти переменные:

• Используют фиксированный порт (вместо случайного), что удобно для настройки перенаправления портов
• Пропускают автоматическое открытие браузера (так как браузер находится на вашей локальной машине)
• Выводят URL в терминале, который вы можете скопировать и открыть в локальном браузере

Перенаправление портов

VS Code Devcontainer: порты обычно автоматически перенаправляются, проверьте вкладку "Ports" в VS Code для подтверждения.

Перенаправление портов SSH: отредактируйте ~/.ssh/config, добавьте:

Host your-server
    LocalForward 9999 localhost:9999

Предупреждения о проблемах

Проблема 1: Команда /plannotator-review не отвечает после установки

Причина: забыли перезапустить Claude Code, Hooks не работают.

Решение: полностью закройте Claude Code и откройте снова.

Проблема 2: Сбой выполнения скрипта установки

Причина: проблемы с сетью или недостаточно прав.

Решение:

• Проверьте сетевое подключение, убедитесь, что можно получить доступ к https://plannotator.ai
• При проблемах с правами попробуйте вручную скачать скрипт установки и выполнить его

Проблема 3: Браузер не открывается в удаленной среде

Причина: в удаленной среде нет графического интерфейса, браузер не может запуститься.

Решение: установите переменную окружения PLANNOTATOR_REMOTE=1 и настройте перенаправление портов.

Проблема 4: Порт занят

Причина: фиксированный порт 9999 уже занят другой программой.

Решение: выберите другой доступный порт, например 8888 или 19432.

Итоги урока

• ✅ Установлена CLI команда Plannotator
• ✅ Настроен Claude Code через систему плагинов или ручной Hook
• ✅ Проверена успешность установки
• ✅ (Опционально) Настроена удаленная/Devcontainer среда

Предварительный просмотр следующего урока

В следующем уроке мы изучим Установка плагина OpenCode.

Если вы используете OpenCode вместо Claude Code, следующий урок научит вас выполнять аналогичную настройку в OpenCode.

---

Приложение: Справочник по исходному коду

Нажмите, чтобы раскрыть расположение исходного кода

Время обновления: 2026-01-24

Функция	Путь к файлу	Строки
Точка входа скрипта установки	README.md	35-60
Описание настройки Hook	apps/hook/README.md	30-39
Пример ручного Hook	apps/hook/README.md	42-62
Настройка переменных окружения	apps/hook/README.md	73-79
Настройка удаленного режима	apps/hook/README.md	81-94

Ключевые константы:

• PLANNOTATOR_REMOTE = "1": включение удаленного режима, использование фиксированного порта
• PLANNOTATOR_PORT = 9999: фиксированный порт для удаленного режима (по умолчанию 19432)
• timeout: 1800: время ожидания Hook (30 минут)

Ключевые переменные окружения:

• PLANNOTATOR_REMOTE: флаг удаленного режима
• PLANNOTATOR_PORT: номер фиксированного порта
• PLANNOTATOR_BROWSER: пользовательский путь к браузеру