vercel-microfrontends

tarafından vercel

Vercel'de mikro ön yüzler oluşturma, yapılandırma ve dağıtma kılavuzu. Kullanıcı mikro ön yüzler, çoklu bölgeler, bir uygulamayı bölme gibi konulardan bahsettiğinde bu beceriyi kullanın.

npx skills add https://github.com/vercel/microfrontends --skill vercel-microfrontends

Vercel Microfrontends

Split a large application into independently deployable units that render as one cohesive app. Vercel handles routing on its global network using microfrontends.json.

Core concepts: default app (has microfrontends.json, serves unmatched requests) · child apps (have routing path patterns) · asset prefix (prevents static-asset collisions) · independent deployments.

Frameworks: Next.js (App Router + Pages Router), SvelteKit, React Router, Vite — all via @vercel/microfrontends.

CLI (vercel microfrontends / vercel mf):

  • create-group — create a new group; interactive by default, or fully non-interactive with --non-interactive (options: --name, --project (repeatable), --default-app, --default-route, --project-default-route (repeatable, format: <project>=<route>, required for each non-default project in non-interactive mode), --yes to skip confirmation prompt); note: --non-interactive is blocked if adding the projects would exceed the free tier limit — the user must confirm billing changes interactively
  • add-to-group — add the current project to an existing group; requires interactive terminal (options: --group, --default-route)
  • remove-from-group — remove the current project from its group; requires interactive terminal (option: --yes skips project-link prompt only)
  • delete-group — delete a group and all its settings, irreversible; requires interactive terminal (option: --group to pre-select group)
  • pull — pull remote microfrontends.json for local development (option: --dpl)
  • microfrontends proxy — local dev proxy · microfrontends port — print auto-assigned port

Finding Detailed Information

This skill includes detailed reference docs in the references/ directory. Do not read all references upfront. Instead, search or grep the relevant file when the user asks about a specific topic:

TopicReference file
Getting started, quickstart, framework setup, microfrontends.json schema, fields, naming, examplesreferences/configuration.md
Path expressions, asset prefixes, flag-controlled routing, middlewarereferences/path-routing.md
Local proxy setup, polyrepo config, Turborepo, ports, deployment protectionreferences/local-development.md
Inspecting groups (inspect-group), adding/removing projects, fallback environments, navigation, observabilityreferences/managing-microfrontends.md
Testing utilities (validateMiddlewareConfig, validateRouting, etc.), debug headers, common issuesreferences/troubleshooting.md
Deployment protection, Vercel Firewall, WAF rules for microfrontendsreferences/security.md

When the user asks about a specific topic, use grep or search over the relevant reference file to find the answer without loading all references into context.

vercel tarafından daha fazla skill

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,…
official
emil-design-eng
vercel
Bu beceri, Emil Kowalski'nin UI cilası, bileşen tasarımı, animasyon kararları ve yazılımı harika hissettiren görünmez detaylar üzerine felsefesini kodlar.
official
vercel-react-best-practices
vercel
Vercel Mühendisliği'nden React ve Next.js performans optimizasyonu yönergeleri. Bu yetenek, React/Next.js yazarken, gözden geçirirken veya yeniden düzenlerken kullanılmalıdır…
official
vercel-react-best-practices
vercel
Vercel Mühendisliği'nden React ve Next.js performans optimizasyonu yönergeleri. Bu yetenek, React/Next.js yazarken, gözden geçirirken veya yeniden düzenlerken kullanılmalıdır…
official
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.
official
release
vercel
Vercel eklentisini yayınla — gate’leri çalıştır, sürümü yükselt, yapıtlar oluştur, commit yap ve push’la. "Yayınla", "gönder", "yükselt ve push’la" veya "sürüm kes" dendiğinde kullan.
official
deepsec
vercel
dev3000'den bir Vercel proje kontrolüne karşı DeepSec çalıştırın. Tek tıklamayla DeepSec kurulumu, proje bağlamı başlatma, sınırlı ilk geçiş işleme ve… için kullanın.
official
backport-pr
vercel
Birleştirilmiş Next.js çekme isteğini canary'den next-16-2 gibi önceki bir sürüm dalına geri taşı. Kullanıcı geri taşıma, kiraz toplama veya bir… açma talebinde bulunduğunda kullan.
official