runtime-debug

por vercel

Use esta habilidade ao reproduzir regressões de inclusão de runtime-bundle, module-resolution ou user-bundle.

npx skills add https://github.com/vercel/next.js --skill runtime-debug

Runtime Debug

Use this skill when reproducing runtime-bundle, module-resolution, or user-bundle inclusion regressions.

Local Repro Discipline

  • Mirror CI env vars when reproducing CI failures.
  • Key variables: IS_WEBPACK_TEST=1 forces webpack (turbopack is default), NEXT_SKIP_ISOLATE=1 skips packing next.js.
  • For module-resolution validation, always rerun without NEXT_SKIP_ISOLATE=1.

Stack Trace Visibility

Set __NEXT_SHOW_IGNORE_LISTED=true to disable the ignore-list filtering in dev server error output. By default, Next.js collapses internal frames to at ignore-listed frames, which hides useful context when debugging framework internals. Defined in packages/next/src/server/patch-error-inspect.ts.

User-Bundle Regression Guardrail

When user next build starts bundling internal Node-only helpers unexpectedly:

  1. Inspect route trace artifacts (.next/server/.../page.js.nft.json).
  2. Inspect traced server chunks for forbidden internals (e.g. next/dist/server/stream-utils/node-stream-helpers.js, node:stream/promises).
  3. Add a test-start-webpack assertion that reads the route trace and traced server chunks, and fails on forbidden internals. This validates user-project bundling (not publish-time runtime bundling).

Bundle Tracing / Inclusion Proof

To prove what user bundling includes, emit webpack stats from the app's next.config.js:

// next.config.js
module.exports = {
  webpack(config) {
    config.profile = true
    return config
  },
}

Then use stats.toJson({ modules: true, chunks: true, reasons: true }) and diff webpack-stats-server.json between modes. This gives concrete inclusion reasons (e.g. which module required node:stream/promises) and is more reliable than analyzer HTML alone.

Related Skills

  • $flags - flag wiring (config/schema/define-env/runtime env)
  • $dce-edge - DCE-safe require patterns and edge constraints
  • $react-vendoring - entry-base boundaries and vendored React

Mais skills de vercel

vercel
vercel
API REST do Vercel emulada para desenvolvimento e testes locais. Use quando o usuário precisar interagir com endpoints da API do Vercel localmente, testar integrações com o Vercel,…
cron-jobs
vercel
Configuração e melhores práticas de Vercel Cron Jobs. Use ao adicionar, editar ou depurar tarefas agendadas em vercel.json.
codegen
vercel
Utilitários de geração de código para json-render. Use ao gerar código a partir de especificações de UI, construir exportadores de código personalizados, percorrer especificações ou serializar props para…
next-best-practice
vercel
Práticas recomendadas do Next.js - convenções de arquivos, limites de RSC, padrões de dados, APIs assíncronas, metadados, tratamento de erros, manipuladores de rotas, otimização de imagens/fontes,…
benchmark-sandbox
vercel
Executa cenários de avaliação do vercel-plugin em Vercel Sandboxes em vez de painéis locais do WezTerm. Provisiona microVMs efêmeras com Claude Code + plugin pré-instalado,…
write-guide
vercel
Produza um guia técnico que ensine um caso de uso do mundo real por meio de exemplos progressivos. Os
benchmark-testing
vercel
Criar e lançar projetos de teste de benchmark para exercitar a injeção de habilidades do vercel-plugin em cenários realistas. Configura diretórios isolados, instala o…
ai-gateway
vercel
Orientação especializada do Vercel AI Gateway. Use ao configurar roteamento de modelos, failover de provedores, rastreamento de custos ou gerenciamento de múltiplos provedores de IA através de uma interface unificada…