Official agent skill

Flags

How to add or modify Next.js experimental feature flags end-to-end.

OfficialMITAuto-check passedDevelopment

Install Flags

skills CLI

$ npx skills add vercel/next.js --skill flags -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install vercel/next.js flags --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/vercel/next.js.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/flags .claude/skills/flags && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Paste into Claude Code

Install the "flags" agent skill from https://github.com/vercel/next.js/tree/canary/.agents/skills/flags into .claude/skills/flags/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "flags", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/vercel/next.js/tree/canary/.agents/skills/flags

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add vercel/next.js --skill flags -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install vercel/next.js flags --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/vercel/next.js.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/flags .agents/skills/flags && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "flags" agent skill from https://github.com/vercel/next.js/tree/canary/.agents/skills/flags into .agents/skills/flags/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "flags", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add vercel/next.js --skill flags -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install vercel/next.js flags --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/vercel/next.js.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/flags .cursor/skills/flags && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "flags" agent skill from https://github.com/vercel/next.js/tree/canary/.agents/skills/flags into .cursor/skills/flags/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "flags", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/vercel/next.js.git --path .agents/skills/flags

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add vercel/next.js --skill flags -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install vercel/next.js flags --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/vercel/next.js.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/flags .gemini/skills/flags && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "flags" agent skill from https://github.com/vercel/next.js/tree/canary/.agents/skills/flags into .gemini/skills/flags/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "flags", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install vercel/next.js flags

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add vercel/next.js --skill flags -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/vercel/next.js.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/flags .github/skills/flags && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "flags" agent skill from https://github.com/vercel/next.js/tree/canary/.agents/skills/flags into .github/skills/flags/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "flags", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add vercel/next.js --skill flags -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install vercel/next.js flags --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/vercel/next.js.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/flags .opencode/skills/flags && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "flags" agent skill from https://github.com/vercel/next.js/tree/canary/.agents/skills/flags into .opencode/skills/flags/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "flags", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: flags
GitHub stars: 143k
Token cost: ~746 tokens
SKILL.md length: 299 words
Files: 1
Skills in repo: 27
Repo updated: Oct 8, 2026
First seen: Oct 8, 2026
Licence: MIT

At a glance

How to add or modify Next.js experimental feature flags end-to-end.

Editing config-shared.ts
SKILL.md covers Required Wiring, Where the Flag Is Consumed, Runtime-Bundle Model and Related Skills
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
Config-schema.ts

What it does

Flags is an agent skill from vercel/next.js, published by the product's own GitHub organization. How to add or modify Next.js experimental feature flags end-to-end. Use when editing config-shared.ts, config-schema.ts, define-env-plugin.ts, next-server.ts, export/worker.ts, or module.compiled.js. Covers type declaration, zod schema, build-time injection, runtime env plumbing, and the decision between runtime env-var branching vs separate bundle variants.

Its SKILL.md is about 750 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Development. It works with Next.js, Zod, Turborepo and webpack. The licence is MIT.

When your agent uses it

Editing config-shared.ts
Config-schema.ts
Define-env-plugin.ts
Export/worker.ts

Example prompts

“/flags”

What it can do on your machine

Read from SKILL.md and the folder at commit a32ddfd. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Flags loads about 746 tokens when it runs. Until then it costs about 92 tokens; SKILL.md has 299 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~92
When it runs · the whole SKILL.md, loaded when a task matches: ~746

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from vercel/next.js at commit a32ddfd, republished under its MIT licence (© vercel). 299 words, ~746 tokens.

Download SKILL.mdSave it as .claude/skills/flags/SKILL.md (or your agent's skills folder).

name: flags
description: How to add or modify Next.js experimental feature flags end-to-end. Use when editing config-shared.ts, config-schema.ts, define-env-plugin.ts, next-server.ts, export/worker.ts, or module.compiled.js. Covers type declaration, zod schema, build-time injection, runtime env plumbing, and the decision between runtime env-var branching vs separate bundle variants.
metadata.internal: true

Feature Flags

Use this skill when adding or changing framework feature flags in Next.js internals.

Required Wiring

All flags need: config-shared.ts (type) → config-schema.ts (zod). If the flag is consumed in user-bundled code (client components, edge routes, app-page.ts template), also add it to define-env.ts for build-time injection. Runtime-only flags consumed exclusively in pre-compiled bundles can skip define-env.ts.

Where the Flag Is Consumed

Client/bundled code only (e.g. __NEXT_PPR in client components): define-env.ts is sufficient. Webpack/Turbopack replaces process.env.X at the user's build time.

Pre-compiled runtime bundles (e.g. code in app-render.tsx): The flag must also be set as a real process.env var at runtime, because app-render.tsx runs from pre-compiled bundles where define-env.ts doesn't reach. Two approaches:

Runtime env var: Set in next-server.ts + export/worker.ts. Both code paths stay in one bundle. Simple but increases bundle size.
Separate bundle variant: Add DefinePlugin entry in next-runtime.webpack-config.js (scoped to bundleType === 'app'), new taskfile tasks, update module.compiled.js selector, and still set env var in next-server.ts + export/worker.ts for bundle selection. Eliminates dead code but adds build complexity.

For runtime flags, also add the field to the NextConfigRuntime Pick type in config-shared.ts.

Runtime-Bundle Model

Runtime bundles are built by next-runtime.webpack-config.js (rspack) via taskfile.js bundle tasks.
Bundle selection occurs at runtime in src/server/route-modules/app-page/module.compiled.js based on process.env vars.
Variants: {turbo/webpack} × {experimental/stable/nodestreams/experimental-nodestreams} × {dev/prod} = up to 16 bundles per route type.
define-env.ts affects user bundling, not pre-compiled runtime internals.
process.env.X checks in app-render.tsx are either replaced by DefinePlugin at runtime-bundle-build time, or read as actual env vars at server startup. They are NOT affected by the user's defines from define-env.ts.
Gotcha: DefinePlugin entries in next-runtime.webpack-config.js must be scoped to the correct bundleType (e.g. app only, not server) to avoid replacing assignment targets in next-server.ts.

$dce-edge - DCE-safe require patterns and edge constraints
$react-vendoring - entry-base boundaries and vendored React
$runtime-debug - reproduction and verification workflow

Files

Just SKILL.md in .agents/skills/flags of vercel/next.js.

Open the folder on GitHubat commit a32ddfd

Compare with similar skills

Flags next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Flags compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Flags this skillvercel/next.js	143k	—	~746	Automated safety check: Pass	MIT	today
Nextjs Turbopackaffaan-m/ECC	275k	1 repos	~300	Automated safety check: Pass	MIT	3 days ago
Nextjs16 Skillselophanto/EloPhanto	106	—	~1.4k	Automated safety check: Pass	Custom licence	7 days ago
Nextjs Turbopackaffaan-m/ECC	275k	—	~841	Automated safety check: Pass	MIT	3 days ago
Nextjs Turbopackaffaan-m/ECC	275k	—	~364	Automated safety check: Pass	MIT	3 days ago
Nextjs Turbopackkurealnum/dotfiles	290	5 repos	~540	Automated safety check: Pass	None	5 mo ago

Similar skills

Nextjs Turbopack
affaan-m/ECC
Next.js 16+ 和 Turbopack — 增量打包、文件系统缓存、开发速度，以及何时使用 Turbopack 与 webpack。
275k GitHub starsUsed in 1 repo~300 tokens
DevelopmentAuto-check passed
Nextjs16 Skills
elophanto/EloPhanto
Key facts and links for Next.js 16. An agent skill from elophanto/EloPhanto.
106 GitHub stars~1.4k tokensUpdated 7 days ago
DevelopmentAuto-check passed
Nextjs Turbopack
affaan-m/ECC
Next.js 16+ y Turbopack — bundling incremental, caché en sistema de archivos, velocidad de desarrollo y cuándo usar Turbopack frente a webpack.
275k GitHub stars~841 tokensUpdated 3 days ago
DevelopmentAuto-check passed
Nextjs Turbopack
affaan-m/ECC
Next.js 16+とTurbopack — インクリメンタルバンドリング、FSキャッシング、開発速度、Turbopackとwebpackをいつどちらかどうかを選ぶか。
275k GitHub stars~364 tokensUpdated 3 days ago
DevelopmentAuto-check passed
Nextjs Turbopack
kurealnum/dotfiles
Next.js 16+ and Turbopack — incremental bundling, FS caching, dev speed, and when to use Turbopack vs webpack.
290 GitHub starsUsed in 5 repos~540 tokens
Backend & APIsAuto-check passed
Prd To Plan
Dwlad90/stylex-swc-plugin
Turn a PRD into a multi-phase implementation plan using tracer-bullet vertical slices, saved as a local Markdown file in ./plans/.
111 GitHub stars~767 tokensUpdated 2 days ago
Product & Project ManagementAuto-check passed

Questions about Flags

What does Flags do?

How to add or modify Next.js experimental feature flags end-to-end. js, published by the product's own GitHub organization.js experimental feature flags end-to-end.

When should I use Flags?

Flags fits situations like: editing config-shared.ts; config-schema.ts; define-env-plugin.ts; export/worker.ts.

How do I install Flags in Claude Code?

Run `npx skills add vercel/next.js --skill flags -a claude-code`. Or copy the skill folder (.agents/skills/flags in vercel/next.js) into .claude/skills/flags in your project. Claude Code loads it when a task matches its description.

How do I install Flags in Codex?

Run `npx skills add vercel/next.js --skill flags -a codex`. Or copy the skill folder (.agents/skills/flags in vercel/next.js) into .agents/skills/flags in your project. Codex loads it when a task matches its description.

Can I use Flags in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add vercel/next.js --skill flags -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/flags, .gemini/skills/flags, .github/skills/flags and .opencode/skills/flags in your project.

What does Flags need to run?

SKILL.md names no scripts, command-line tools or credentials: Flags is instructions for the agent only.

Does Flags access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Flags safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Flags use?

Flags is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Flags use?

About 746 tokens (SKILL.md is roughly 3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Flags?

Skills that share tags, products or a category with Flags: Nextjs Turbopack (affaan-m/ECC, 275k stars), Nextjs16 Skills (elophanto/EloPhanto, 106 stars), Nextjs Turbopack (affaan-m/ECC, 275k stars) and Nextjs Turbopack (affaan-m/ECC, 275k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Flags?

vercel (a GitHub organization, an official publisher) maintains it in vercel/next.js, which has 143,241 GitHub stars. The repository holds 27 skills in this directory. The repository was last updated on October 8, 2026.

Source: vercel/next.js on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

Flags

Install Flags

Facts

At a glance

What it does

When your agent uses it

Example prompts

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

Feature Flags

Required Wiring

Where the Flag Is Consumed

Runtime-Bundle Model

Files

Compare with similar skills

Similar skills

Nextjs Turbopack

Nextjs16 Skills

Nextjs Turbopack

Nextjs Turbopack

Nextjs Turbopack

Prd To Plan

More from vercel/next.js

Gh Stack

Sandbox Bench

Next Dev Loop

Docs Diagrams

Next Cache Components Adoption

React Sync

Questions about Flags

Install Flags

Facts

At a glance

What it does

When your agent uses it

Example prompts

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

Feature Flags

Required Wiring

Where the Flag Is Consumed

Runtime-Bundle Model

Related Skills

Files

Compare with similar skills

Similar skills

More from vercel/next.js

Related

Questions about Flags