SKILL.md
$27
Adding Node.js-Only React APIs
These exist in .node builds but not in the type definitions. Steps:
- Add type declarations to
$$compiled.internal.d.ts.
- Export the API from
entry-base.tsbehind aprocess.envguard.
- Access it via
ComponentModin other files.
// In entry-base.ts (react-server layer) only:
/* eslint-disable import/no-extraneous-dependencies */
export let renderToPipeableStream: ... | undefined
if (process.env.__NEXT_USE_NODE_STREAMS) {
renderToPipeableStream = (
require('react-server-dom-webpack/server.node') as typeof import('react-server-dom-webpack/server.node')
).renderToPipeableStream
} else {
renderToPipeableStream = undefined
}
/* eslint-enable import/no-extraneous-dependencies */
// In other files, access via ComponentMod:
ComponentMod.renderToPipeableStream!(payload, clientModules, opts)ESLint Practical Rule
For guarded runtime require() blocks that need import/no-extraneous-dependencies suppression, prefer scoped block disable/enable. If using eslint-disable-next-line, the comment must be on the line immediately before the require() call, NOT before the const declaration. When the const and require() are on different lines, this is error-prone.
Turbopack Remap
react-server-dom-webpack/* is silently remapped to react-server-dom-turbopack/* by Turbopack's import map. Code says "webpack" everywhere, but Turbopack gets its own bindings at runtime. This affects debugging: stack traces and error messages will reference the turbopack variant.
Related Skills
$flags- flag wiring (config/schema/define-env/runtime env)
$dce-edge- DCE-safe require patterns and edge constraints
$runtime-debug- reproduction and verification workflow