runtime-debug

tarafından vercel

Bu beceriyi, runtime-bundle, module-resolution veya user-bundle ekleme regresyonlarını yeniden üretirken kullanın.

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

vercel tarafından daha fazla skill

vercel
vercel
Yerel geliştirme ve test için öykünülmüş Vercel REST API'si. Kullanıcının Vercel API uç noktalarıyla yerel olarak etkileşime geçmesi, Vercel entegrasyonlarını test etmesi gerektiğinde kullanın,…
cron-jobs
vercel
Vercel Cron Jobs yapılandırması ve en iyi uygulamalar. vercel.json dosyasında zamanlanmış görevler eklerken, düzenlerken veya hata ayıklarken kullanın.
codegen
vercel
json-render için kod oluşturma yardımcıları. UI şartnamelerinden kod oluştururken, özel kod dışa aktarıcıları oluştururken, şartnameleri tararken veya özellikleri serileştirirken kullanın…
next-best-practice
vercel
Next.js en iyi uygulamaları - dosya kuralları, RSC sınırları, veri desenleri, async API'ler, meta veriler, hata yönetimi, rota işleyicileri, resim/yazı tipi optimizasyonu,…
benchmark-sandbox
vercel
Vercel Sandbox'larda vercel-plugin eval senaryolarını çalıştırır, yerel WezTerm panelleri yerine. Claude Code ve önceden yüklenmiş plugin ile geçici mikroVM'ler sağlar,…
write-guide
vercel
Gerçek dünya kullanım senaryosunu aşamalı örneklerle öğreten bir teknik rehber oluşturur. Kavramlar yalnızca okuyucunun ihtiyaç duyduğu anda tanıtılır.
benchmark-testing
vercel
Gerçekçi senaryolarda vercel-plugin beceri enjeksiyonunu test etmek için benchmark test projeleri oluşturup başlatır. İzole dizinler kurar, yükler…
ai-gateway
vercel
Vercel AI Gateway uzman rehberliği. Model yönlendirme, sağlayıcı yedekleme, maliyet takibi yapılandırırken veya birden fazla AI sağlayıcısını birleşik bir şekilde yönetirken kullanın…