dce-edge by vercel/next.js
npx skills add https://github.com/vercel/next.js --skill dce-edge当修改条件性 require() 路径、仅限 Node 的导入或 edge/runtime 分支时,请使用此技能。
require() 模式Webpack 仅在 require() 位于 if/else 的死分支中,且其条件能被 DefinePlugin 在编译时求值的情况下,才会对其进行 DCE(死代码消除)。
// 正确 - webpack 可以消除死分支
if (process.env.__NEXT_USE_NODE_STREAMS) {
require('node:stream')
} else {
// web 路径
}
不适用的情况:
require() 仍会被追踪。else 的单独 语句:对于内联的 说明符有效,但对于引入新文件到模块图的 无效。广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
ifnode:*require('./some-module')务必使用 pnpm test-start-webpack 在 test/e2e/app-dir/app/standalone.test.ts(包含 edge 路由)上测试 edge 变更,不要使用 NEXT_SKIP_ISOLATE=1,因为它会跳过完整的 webpack 编译。
当根据 process.env.X 条件性地给变量赋值时,请使用 if/else(而不是两个独立的 if 块)。TypeScript 无法证明跨 if (flag) { x = a }; if (!flag) { x = b } 的穷尽性,会报错“变量在赋值前被使用”。if/else 模式能同时满足 TypeScript(明确赋值)和 webpack DCE 的要求。
平台特定代码(node 与 web)可以使用一个单一的 .ts 切换器模块,该模块有条件地 require() .node.ts 或 .web.ts 文件到一个类型化的变量中,然后将共享的运行时 API 作为命名导出重新导出。保持分支为 if/else,以便 DefinePlugin 可以死代码消除未使用的 require()。将共享类型规范地放在 .node.ts 中,.web.ts 通过 import type 导入它们,切换器根据需要重新导出类型。示例:stream-ops.ts 和 debug-channel-server.ts。
NEXT_RUNTIME 不是功能标志在用户项目的 webpack 服务器编译器中,process.env.NEXT_RUNTIME 被内联为 'nodejs'。使用 NEXT_RUNTIME === 'nodejs' 来守卫仅限 Node 的 require('node:*') 路径不会修剪任何代码。对于功能门控的代码路径,应使用真正的功能定义进行守卫(例如 process.env.__NEXT_USE_NODE_STREAMS)。
Edge 路由不使用预编译的运行时包。它们由用户的 webpack/Turbopack 编译,因此 define-env.ts 控制 DCE。对于 edge 构建,在 define-env.ts 中必须强制将门控 node:* 导入的功能标志设置为 false(isEdgeServer ? false : flagValue),否则 webpack 将尝试解析 node:stream 等并失败。
app-page.ts 模板注意事项app-page.ts 是一个由用户打包器编译的构建模板。此文件中的任何 require() 都会在 next build 时被 webpack/turbopack 追踪。你不能使用相对路径 require 内部模块,因为从用户项目中无法解析它们。相反,应从 entry-base.ts 导出新的辅助函数,并在模板中通过 entryBase.* 访问它们。RenderResult 之外。如果 app-page.ts 需要一个仅限 Node 流的工具,建议在 server/stream-utils/ 中使用一个小的专用辅助模块(采用 DCE 安全的 if/else + require())。pnpm test-start-webpack test/e2e/app-dir/app/standalone.test.ts 验证 edge 打包的回归问题。NEXT_SKIP_ISOLATE=1 的情况下进行验证。$flags - 标志配置(配置/模式/定义环境/运行时环境)$react-vendoring - entry-base 边界和打包的 React$runtime-debug - 复现和验证工作流每周安装量
277
代码仓库
GitHub 星标
138.5K
首次出现
2026年2月17日
安全审计
安装于
gemini-cli265
opencode264
codex264
github-copilot263
kimi-cli262
amp261
Use this skill when changing conditional require() paths, Node-only imports, or edge/runtime branching.
require() PatternWebpack only DCEs a require() when it sits inside the dead branch of an if/else whose condition DefinePlugin can evaluate at compile time.
// CORRECT - webpack can eliminate the dead branch
if (process.env.__NEXT_USE_NODE_STREAMS) {
require('node:stream')
} else {
// web path
}
What does NOT work:
require() is still traced.if without else: works for inline node:* specifiers but NOT for require('./some-module') that pulls a new file into the module graph.Always test edge changes with pnpm test-start-webpack on test/e2e/app-dir/app/standalone.test.ts (has edge routes), not with NEXT_SKIP_ISOLATE=1 which skips the full webpack compilation.
Use if/else (not two independent if blocks) when assigning a variable conditionally on process.env.X. TypeScript cannot prove exhaustiveness across if (flag) { x = a }; if (!flag) { x = b } and will error with "variable used before being assigned". The if/else pattern satisfies both TypeScript (definite assignment) and webpack DCE.
Platform-specific code (node vs web) can use a single .ts switcher module that conditionally require()s either .node.ts or .web.ts into a typed variable, then re-exports the shared runtime API as named exports. Keep the branch as if/else so DefinePlugin can dead-code-eliminate the unused require(). Keep shared types canonical in .node.ts, with .web.ts importing them via import type and the switcher re-exporting types as needed. Examples: stream-ops.ts and debug-channel-server.ts.
NEXT_RUNTIME Is Not a Feature FlagIn user-project webpack server compilers, process.env.NEXT_RUNTIME is inlined to 'nodejs'. Guarding Node-only require('node:*') paths with NEXT_RUNTIME === 'nodejs' does not prune anything. For feature-gated codepaths, guard on the real feature define (e.g. process.env.__NEXT_USE_NODE_STREAMS).
Edge routes do NOT use pre-compiled runtime bundles. They are compiled by the user's webpack/Turbopack, so define-env.ts controls DCE. Feature flags that gate node:* imports must be forced to false for edge builds in define-env.ts (isEdgeServer ? false : flagValue), otherwise webpack will try to resolve node:stream etc. and fail.
app-page.ts Template Gotchasapp-page.ts is a build template compiled by the user's bundler. Any require() in this file is traced by webpack/turbopack at next build time. You cannot require internal modules with relative paths because they won't be resolvable from the user's project. Instead, export new helpers from entry-base.ts and access them via entryBase.* in the template.RenderResult. If app-page.ts needs a Node-stream-only utility, prefer a small dedicated helper module in server/stream-utils/ (with DCE-safe if/else + require()).pnpm test-start-webpack test/e2e/app-dir/app/standalone.test.tsNEXT_SKIP_ISOLATE=1$flags - flag wiring (config/schema/define-env/runtime env)$react-vendoring - entry-base boundaries and vendored React$runtime-debug - reproduction and verification workflowWeekly Installs
277
Repository
GitHub Stars
138.5K
First Seen
Feb 17, 2026
Security Audits
Gen Agent Trust HubPassSocketPassSnykPass
Installed on
gemini-cli265
opencode264
codex264
github-copilot263
kimi-cli262
amp261
Azure 升级评估与自动化工具 - 轻松迁移 Functions 计划、托管层级和 SKU
68,100 周安装
代码复杂度分析工具:Python/Go代码质量检测与重构指南
273 周安装
批量处理器技能 - 高效批量处理文档,支持PDF转换、文本提取、文件重命名
273 周安装
Cypress 自动化测试指南:E2E 与组件测试最佳实践、安装配置与故障排除
273 周安装
Antigravity Manager - AI账户管理器与代理网关,支持Gemini/Claude多账户轮换与协议转换
273 周安装
Inngest 持久化函数教程:构建容错工作流与 TypeScript 实践指南
273 周安装
AI合同审查工具 - 依据谈判手册自动分析条款、标记偏差与商业影响
273 周安装