Flags SDK — скилл

Код флагов на Flags SDK для Next.js и SvelteKit и работа с Vercel Flags через дашборд и vercel flags, два скилла

  • 629 ★ репозитория
  • Последний коммит
  • MIT
СкиллОфициальный

Расширенный доступ

Почему такой уровень

  • Команды `vercel flags` создают, меняют и архивируют флаги в проекте Vercel, то есть меняют то, что видят пользователи
  • Настройка записывает `FLAGS_SECRET` в переменные окружения Vercel командой `vercel env add`
Все причины и проверки

vercel/flags

Установка

В терминале, через SkillFoxx CLI

npx skillfoxx add skills/flags-sdk

Определит агенты на машине, покажет уровень доступа и зафиксирует версию.

Другие способы установки

Доступ и проверки

Как мы проверяем

Расширенный доступИнструмент запускает код или ходит в сеть, а внешние данные только читает.

  • Команды `vercel flags` создают, меняют и архивируют флаги в проекте Vercel, то есть меняют то, что видят пользователи
  • Настройка записывает `FLAGS_SECRET` в переменные окружения Vercel командой `vercel env add`

Это чужой код. Посмотрите файлы в репозитории перед установкой.

Что делает

В репозитории vercel/flags лежат библиотека Flags SDK (пакет `flags` на npm) и два скилла для агента в папке skills. Скилл `flags-sdk` ведет установку и настройку пакета, объявление флагов через `flag()`, подключение адаптеров (Vercel, Statsig, LaunchDarkly, PostHog, GrowthBook, OpenFeature, Split, Flagsmith, Reflag, Optimizely и свой), `identify`, `dedupe`, `evaluate`, предварительный расчет `precompute` для статичных страниц, Flags Explorer с Vercel Toolbar и шифрование значений. Он работает с Next.js и SvelteKit. Скилл `vercel-flags` отвечает за все вокруг кода: планирование флага, выбор между Flags SDK, `@vercel/flags-core` и OpenFeature, работу в дашборде Vercel, команды `vercel flags` (`create`, `inspect`, `set`, `split`, `rollout`, `rules`, `segments`, `evaluations`, `archive`, `connections`), подключения проекта, ключи OIDC и SDK, переменную `FLAGS_SECRET`. Перед архивацией или удалением флага скилл требует сначала убрать код из проекта и убедиться, что за окно Skew Protection вычислений не было.

Для кого. Командам на Next.js или SvelteKit в Vercel, которые вводят флаги функций, A/B-тесты и постепенные выкаты.

Подходит, если

  • Новую функцию в Next.js прячут за флаг и включают постепенно по процентам
  • Страницы должны оставаться статичными, а варианты эксперимента считаться заранее через `precompute`
  • Вы выбираете между Flags SDK, `@vercel/flags-core` и OpenFeature для проекта на другом фреймворке
  • Старый флаг пора убрать: код, проверка вычислений и архивация идут по порядку

Не подходит, если

  • Проект не в Vercel и не на Next.js или SvelteKit: скилл `flags-sdk` написан для этой пары фреймворков
  • Нужен только готовый провайдер флагов с дашбордом, без правки кода: хватит документации провайдера
  • Требуется общий набор скиллов Vercel для деплоя и AI SDK: для него есть официальный плагин Vercel

Пример запроса к агенту

Добавь в Next.js-проект флаг `new-checkout` на Flags SDK с адаптером Vercel и включи его для 10% пользователей

Ограничения

README репозитория установку скиллов не описывает; команда `npx skills add vercel/flags@vercel-flags` взята из самого SKILL.md. Переменная `FLAGS_SECRET` обязательна: 32 случайных байта в base64, отдельное значение для каждого окружения, для Preview и Production с пометкой Sensitive. Команды `vercel flags` требуют Vercel CLI и вошедшего в аккаунт пользователя. Для проектов на других фреймворках SDK заменяет `@vercel/flags-core`.

Как отключить. Удалите папки `flags-sdk` и `vercel-flags` из каталога скиллов агента. Пакет `flags` убирают из проекта командой `npm uninstall flags`.

Частые вопросы

Как создать FLAGS_SECRET?

Сгенерируйте 32 случайных байта: `node -e "console.log(crypto.randomBytes(32).toString('base64url'))"`. Для каждого окружения нужно свое значение, запишите его командой `vercel env add FLAGS_SECRET production --sensitive --value <секрет>`.

Чем `flags-sdk` отличается от `vercel-flags`?

Flags-sdk касается кода: объявление флагов, адаптеры, `precompute`. Vercel-flags охватывает планирование, дашборд и команды `vercel flags`. Они ссылаются друг на друга: каждый сообщает, когда нужен второй.

Нужен ли провайдер флагов?

Нет, SDK работает с любым провайдером, с самодельной настройкой и вовсе без провайдера. Собственный провайдер Vercel, Vercel Flags, подключается адаптером `@flags-sdk/vercel`.

Как установить сам Flags SDK?

Выполните `npm install flags`, задайте переменную `FLAGS_SECRET` и объявите флаг в `app/flags.tsx` через `flag()` из `flags/next`. Вызов флага в серверном компоненте возвращает его значение.

Какие провайдеры флагов поддерживаются?

В README названы LaunchDarkly, Optimizely и Statsig, в скилле еще PostHog, GrowthBook, OpenFeature, Split, Flagsmith, Reflag и Global Config. Можно написать свой адаптер.

Обсуждение

Вопросов и отзывов пока нет.

Скиллы

Больше 200 скиллов по стекам и практикам: React, Next.js, Rails, Rust, Python, отладка, TDD и ревью интерфейсов

СкиллМинимальный доступ225Звезды репозитория
Официальный

Скилл AI SDK от Vercel: агент пишет чат, стриминг и агентов по документации установленной версии пакета

СкиллРасширенный доступ27,9 тыс.Звезды репозитория

Скиллы по Dart и Flutter от kevmoo: Effective Dart, возможности языка, тесты, покрытие, профилирование и поиск устаревших приемов

ПлагинМинимальный доступ148Звезды репозитория

Установщик каталога скиллов для .NET: сам подбирает их по файлам проекта и ставит в Claude Code, Codex, Copilot и Gemini CLI

CLIРасширенный доступ513Звезды репозитория
Официальный

Набор скиллов к экспериментальному Native SDK: агент получает от установленного CLI справку по версии тулкита для настольных приложений на TypeScript

СкиллРасширенный доступ7,8 тыс.Звезды репозитория

Плагин из 24 скиллов для Claude Code: ИИ-приложения на Next.js, AI SDK 7, shadcn/ui, pgvector, проверка интерфейса в браузере

ПлагинРасширенный доступ71Звезды репозитория

Сравнение с похожими

Карточки с тем же главным запросом: чем они отличаются.

ИнструментОфициальныйЗвезды репозиторияГлавное отличие
Flags SDK (эта карточка)да629
Vercel Pluginнет334общий плагин Vercel с графом экосистемы и деплоем, здесь два скилла только про флаги
Скиллы Vercel для агентовнет33 964скиллы про производительность React и Next.js, здесь работа с флагами и экспериментами

Коротко о README

README представляет Flags SDK как набор инструментов для флагов в Next.js и SvelteKit от создателей Next.js, показывает установку `npm install flags`, настройку `FLAGS_SECRET`, пример флага для серверного компонента и перечисляет адаптеры. Полная документация вынесена на `flags-sdk`.dev.

Бейдж для README

Исходный SKILL.md

---
name: vercel-flags
description: >
  Feature flags, A/B tests, and gradual rollouts with Vercel Flags, in any app or framework.
  Use whenever the user is planning, adding, changing, or cleaning up a feature flag, toggle, kill switch,
  experiment, percentage rollout, or targeting rule, or wants to gate or hide a feature for some
  users, even before a library or provider is chosen. Covers choosing an integration (Flags SDK,
  `@vercel/flags-core`, OpenFeature), the Vercel dashboard, the `vercel flags` CLI (create, inspect,
  set, split, rollout, rules, segments, evaluations, archive, connections), Project Connections, OIDC vs SDK keys, `FLAGS_SECRET`, and
  Flags Explorer overrides. For `flag()` declarations, adapters, precompute, and the Flags Explorer
  endpoint in Next.js or SvelteKit code, load the `flags-sdk` skill.
---

# Vercel Flags

Vercel Flags is Vercel's feature flags platform. Flags are created and managed in the Vercel dashboard or with the `vercel flags` CLI, evaluated server-side in your app, and switched per environment (Development, Preview, Production) without a redeploy.

- Docs: https://vercel.com/docs/flags
- CLI reference: https://vercel.com/docs/cli/flags

Use this skill to decide how a feature should be flagged, to create and change flags, and to run rollouts and experiments. Write app code with the skill that matches the stack (see [Choose an approach](#choose-an-approach)). Do not leave CLI steps as "next steps" for the user; execute them yourself.

## Route the request

- **Planning** ("put this behind a flag", "roll this out to 10%", "A/B test the pricing page", "add a kill switch"): follow [Plan a flag](#plan-a-flag), then [Choose an approach](#choose-an-approach).
- **Create or manage a flag with no code change** (create, inspect, enable, set, split, rollout, rules, archive): follow [Manage flags with the CLI](#manage-flags-with-the-cli). This needs an authenticated CLI, not SDK packages, Toolbar, Flags Explorer, or `.env.local` (except `vercel flags override`, which reads `FLAGS_SECRET`).
- **Share flags between projects**: follow [Project Connections](references/cli.md#project-connections) to connect projects in the same team, then configure the consumer application.
- **Clean up or remove a flag** ("remove this flag", "clean up stale flags", "inline this flag"): follow [references/cleanup.md](references/cleanup.md), then [Lifecycle and safety](references/cli.md#lifecycle-and-safety) before archiving.
- **Add a flag to an app that already uses the Flags SDK** (`flags` in `package.json`): load the `flags-sdk` skill right away; it creates the flag on Vercel and declares it in code.
- **Implement in code otherwise**: follow [Choose an approach](#choose-an-approach) and load the matching skill or reference. Inside an app repository, treat an ambiguous request as plan, create, and implement.

## Choose an approach

Check the project before writing code.

- **Already using another flag provider** (Statsig, LaunchDarkly, PostHog, GrowthBook, and so on): keep it. On Next.js or SvelteKit, the Flags SDK connects to it through an adapter; load the `flags-sdk` skill. On any other stack, use the provider's own SDK. Rollouts, targeting, and experiments for that provider are configured in its own dashboard, not with `vercel flags`; the CLI and lifecycle sections of this skill do not apply.
- **No provider yet**: use Vercel Flags. Pick the integration by stack ([SDKs](https://vercel.com/docs/flags/vercel-flags/sdks)):
  - **Next.js or SvelteKit**: the Flags SDK (`flags` + `@flags-sdk/vercel`). It adds Flags Explorer integration and precompute for static pages. Load the `flags-sdk` skill. If it is not available, suggest `npx skills add vercel/flags@flags-sdk` (do not auto-install).
  - **Any other framework or a plain server** (for example Express): `@vercel/flags-core`. See [Other frameworks](#other-frameworks).
  - **The user wants provider portability or already uses OpenFeature**: the Vercel Flags OpenFeature provider ([Using OpenFeature with Vercel Flags](https://vercel.com/docs/flags/vercel-flags/sdks/openfeature)).

The dashboard and the `vercel flags` CLI work the same for every integration.

## Plan a flag

Сообщить о проблеме