Feature Flags
SkillSearchGuides your agent through adding or changing Next.js experimental feature flags across config, schema, and build files.
Available today. Use it from your connected AI after setup.
No other account needed.
Connect ahel once, and every AI you use reads what you have installed.
Then ask your AI: use the Feature Flags skill
About this capability
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 be
What this skill tells your AI
The instructions your AI receives, as published by vercel/next.js in .agents/skills/flags/SKILL.md and read by ahel’s review.
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 tobundleType === 'app'), new taskfile tasks, updatemodule.compiled.jsselector, and still set env var innext-server.ts+export/worker.tsfor 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) viataskfile.jsbundle tasks. - Bundle selection occurs at runtime in
src/server/route-modules/app-page/module.compiled.jsbased onprocess.envvars. - Variants:
{turbo/webpack} × {experimental/stable/nodestreams/experimental-nodestreams} × {dev/prod}= up to 16 bundles per route type. define-env.tsaffects user bundling, not pre-compiled runtime internals.process.env.Xchecks inapp-render.tsxare 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 fromdefine-env.ts.- Gotcha: DefinePlugin entries in
next-runtime.webpack-config.jsmust be scoped to the correctbundleType(e.g.apponly, notserver) to avoid replacing assignment targets innext-server.ts.
Related Skills
$dce-edge- DCE-safe require patterns and edge constraints$react-vendoring- entry-base boundaries and vendored React$runtime-debug- reproduction and verification workflow
Signals
- GitHub stars
- 142k
- Forks
- 32k
- Last commit
- Sep 2026
- Hacker News mentions
- 20
Advanced
- Catalog kind
- skill
- Gateway key
flags- Source
- github.com/vercel/next.js