dce-edge

Implement DCE-safe require patterns for Node-only imports in Next.js edge builds.

142k|31.7k|Updated Oct 5, 2016
One-click install
npx skills add https://github.com/vercel/next.js --skill dce-edge
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: dce-edge
Source: https://github.com/vercel/next.js/tree/main/.agents/skills/dce-edge
Command: npx skills add https://github.com/vercel/next.js --skill dce-edge

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

DCE-safe require patterns and edge-runtime constraints help you write code that remains compatible with Next.js edge builds by preventing unsafe dynamic imports and ensuring dead-code elimination works as intended.

Core Features & Use Cases

  • DCE-safe conditional require patterns to allow webpack to prune dead branches.
  • TypeScript definite assignment patterns for edge-friendly code paths.
  • Compile-time switcher patterns to guard node vs web imports.
  • Guidance on NEXT_RUNTIME vs real feature flags and edge-specific guardrails.
  • Practical examples for app-page.ts and edge route scenarios.

Quick Start

Patch your code to guard Node-only imports with a proper DefinePlugin flag and verify edge builds using the provided webpack tests.

Frequently Asked Questions about dce-edge

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

FAQPage Schema
How do I guard Node-only imports for Next.js edge runtime builds?

Guard Node-only imports for Next.js edge builds by applying DCE-safe require patterns with webpack DefinePlugin flags, enabling webpack to prune dead branches and ensure correct edge-runtime behavior.

What is dead-code elimination in webpack and how does it work with edge runtime?

Dead-code elimination in webpack removes unreachable code branches during bundling. For edge runtime, DCE-safe require patterns use compile-time flags to ensure Node-only modules are pruned, preventing unsafe dynamic imports from breaking edge builds.

Should I use NEXT_RUNTIME or real feature flags for edge-runtime branching?

Use real feature flags instead of NEXT_RUNTIME for edge-runtime branching. NEXT_RUNTIME is not a feature flag and can cause incorrect dead-code elimination. Real feature flags ensure proper compile-time switching and correct runtime behavior in edge builds.

How do I implement TypeScript definite assignment patterns for edge-friendly code paths?

Implement TypeScript definite assignment patterns for edge-friendly code paths by using compile-time switcher patterns that guard node vs web imports. This ensures DCE-safe conditional requires work correctly across edge builds and app-page.ts scenarios.

Why does my edge build fail with unsafe dynamic imports in Next.js?

Edge builds fail with unsafe dynamic imports because webpack cannot prune dead branches without DCE-safe require patterns. Patch your code to guard Node-only imports using DefinePlugin flags and verify edge builds with webpack tests.

Can I use conditional require patterns in edge route scenarios with Next.js?

Yes, you can use DCE-safe conditional require patterns in edge route scenarios with Next.js. Apply compile-time switcher patterns with DefinePlugin flags to guard Node-only imports and ensure webpack properly eliminates dead code for edge builds.