flags

Implement Next.js experimental feature flags across build and runtime environments.

1|Updated Aug 17, 2025
One-click install
npx skills add https://github.com/SolaneHub/PokeMMO-Compendium --skill flags-solanehub
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: flags
Source: https://github.com/SolaneHub/PokeMMO-Compendium/tree/main/.agents/skills/flags
Command: npx skills add https://github.com/SolaneHub/PokeMMO-Compendium --skill flags-solanehub

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines the process of adding, modifying, and managing experimental feature flags within the Next.js framework, ensuring proper integration across build and runtime environments.

Core Features & Use Cases

  • End-to-End Flag Management: Covers type declarations, schema definition, build-time injection, and runtime environment variable plumbing.
  • Bundle Optimization: Provides strategies for deciding between runtime environment variable branching or separate bundle variants to manage flag usage.
  • Use Case: When introducing a new experimental feature in Next.js that requires configuration via feature flags, use this Skill to ensure it's correctly implemented from configuration to runtime behavior.

Quick Start

Use the flags skill to add a new experimental feature flag to Next.js configuration.

Frequently Asked Questions about flags

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement Next.js experimental feature flags end-to-end?

Next.js experimental feature flags require managing type declarations, zod schema definitions, build-time injections via define-env-plugin.ts, and runtime environment plumbing in next-server.ts and export/worker.ts for proper integration.

What is the best way to optimize bundles when using Next.js feature flags?

The best way to optimize bundles when using Next.js feature flags is deciding between runtime environment variable branching for dynamic checks or generating separate bundle variants for static code delivery.

How does build-time injection work for Next.js feature flags?

Build-time injection for Next.js feature flags uses the define-env-plugin.ts to statically replace configuration values during the build process, ensuring flags are compiled directly into the application bundle.

Do I need zod schema definitions for Next.js experimental features?

Zod schema definitions are needed for Next.js experimental features to validate flag configurations and ensure type safety, working alongside type declarations to maintain consistency between build-time injection and runtime environment plumbing.

Can I manage Next.js runtime environment variables for feature flags without separate bundle variants?

You can manage Next.js runtime environment variables for feature flags without separate bundle variants by using runtime env-var branching in next-server.ts and export/worker.ts, allowing dynamic flag checks within a single bundle.

When should I use separate bundle variants instead of runtime environment branching for Next.js flags?

Use separate bundle variants instead of runtime environment branching for Next.js flags when you need optimized code delivery by eliminating runtime checks, whereas runtime branching is better for dynamic configuration without rebuilding.