Урок 17. Справочник: CLI и components.json

📁 Раздел: shadcn/ui ⏱️ Время изучения: ~50 мин 🎯 Сложность: Средняя

⚡ Кратко

init настраивает проект, add добавляет компоненты, components.json хранит ответы на вопросы CLI.

Ключи init

Ключ	Значение
`-t, --template <template>`	шаблон нового проекта: `next`, `start`, `vite`, `react-router`, `laravel`, `astro`
`-b, --base <base>`	набор примитивов: `base`, `radix`, `aria`
`-p, --preset [name]`	готовая конфигурация
`-d, --defaults`	значения по умолчанию без вопросов
`-y, --yes`	не спрашивать подтверждение
`-f, --force`	перезаписать существующую конфигурацию
`-c, --cwd <cwd>`	рабочая директория
`-n, --name <name>`	имя нового проекта
`--css-variables` / `--no-css-variables`	темизация через CSS-переменные (по умолчанию включена)
`--rtl` / `--no-rtl`	поддержка письма справа налево
`--pointer` / `--no-pointer`	курсор-указатель на кнопках
`--monorepo` / `--no-monorepo`	структура монорепозитория
`--reinstall` / `--no-reinstall`	переустановить уже добавленные компоненты
`-s, --silent`	без вывода

Ключи add

Ключ	Значение
`[components…]`	адреса элементов реестра
`-y, --yes`	без подтверждения
`-o, --overwrite`	перезаписать существующие файлы
`-a, --all`	добавить все компоненты
`-p, --path <path>`	куда положить файлы
`-c, --cwd <cwd>`	рабочая директория
`--dry-run`	показать изменения без записи
`--diff [path]`	показать отличия от реестра
`--view [path]`	показать содержимое файла
`-s, --silent`	без вывода

components.json

📄 components.json

{
  "$schema": "https://ui.shadcn.com/schema.json",
  "style": "base-nova",
  "rsc": false,
  "tsx": true,
  "tailwind": {
    "config": "",
    "css": "src/index.css",
    "baseColor": "neutral",
    "cssVariables": true,
    "prefix": ""
  },
  "iconLibrary": "lucide",
  "rtl": false,
  "aliases": {
    "components": "@/components",
    "utils": "@/lib/utils",
    "ui": "@/components/ui",
    "lib": "@/lib",
    "hooks": "@/hooks"
  },
  "menuColor": "default",
  "menuAccent": "subtle",
  "registries": {}
}

Поле	Что задаёт
`style`	стиль реестра, например `base-nova`
`rsc`	добавлять ли директиву `"use client"` (для Next.js)
`tsx`	TypeScript или JavaScript
`tailwind.css`	путь к главному CSS-файлу проекта
`tailwind.baseColor`	базовый нейтральный цвет темы: `neutral`, `slate`, `zinc`, `stone`, `gray`
`tailwind.cssVariables`	темизация переменными (иначе — прямыми цветами)
`tailwind.prefix`	префикс утилит, если он используется в проекте
`tailwind.config`	путь к конфигу v3; для v4 пустая строка
`iconLibrary`	набор иконок: `lucide` и другие
`rtl`	поддержка письма справа налево
`aliases.*`	куда класть компоненты, утилиты, хуки
`registries`	дополнительные реестры (свои или сторонние)

⚠️ Проверить по документации: поля menuColor и menuAccent относятся к оформлению стиля base-nova; их состав может отличаться в других стилях и версиях CLI.

Требования к проекту

Что	Требование
Tailwind	версия 4 (для v3 — старые инструкции и другой конфиг)
Алиас `@/`	в конфигурации сборщика и в `tsconfig`
React	19 (для актуального реестра)
Главный CSS	импортирован в приложение