Skip to main content
configure-cache-busting Cache-busting for Next.js and Vite: content hashing, CDN cache headers. Use when adding Vercel/Cloudflare cache headers or auditing static asset caching.
Zur Installation springen Skills Marktplatz Entdecken und erkunden Sie KI-Skills, die von der Community erstellt wurden.
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Prompt-Details anzeigen Ein direkter Befehl überspringt den Prüf-Prompt. Prüfen Sie die Quelle, bevor Sie ihn ausführen.
npx skills add https://github.com/laurigates/claude-plugins --skill configure-cache-bustingDer Befehl bleibt in einer Zeile. Scrollen Sie horizontal, um ihn vor dem Kopieren vollständig zu prüfen.
Sie bevorzugen eine lokale Kopie? Laden Sie die Dateien herunter, die SkillsMP derzeit vorliegen.
ZIP herunterladen Herunterladen... Verwandte Berufe SOC
Basierend auf der SOC-Berufsklassifikation
created "2025-12-16T00:00:00.000Z" modified "2026-04-19T00:00:00.000Z" reviewed "2025-12-16T00:00:00.000Z" description Cache-busting for Next.js and Vite: content hashing, CDN cache headers. Use when adding Vercel/Cloudflare cache headers or auditing static asset caching. allowed-tools Glob, Grep, Read, Write, Edit, Bash, AskUserQuestion, TodoWrite args [--check-only] [--fix] [--framework <nextjs|vite>] [--cdn <cloudflare|vercel|none>] argument-hint [--check-only] [--fix] [--framework <nextjs|vite>] [--cdn <cloudflare|vercel|none>] name configure-cache-busting
When to Use This Skill
Use this skill when... Use another approach when... Configuring content hashing for Next.js or Vite builds Optimizing server-side caching (nginx, CDN config directly) Setting up CDN cache headers for Vercel or Cloudflare Debugging build output issues (system-debugging agent) Verifying cache-busting compliance after a framework upgrade Configuring general CI/CD workflows (/configure:workflows) Adding build verification scripts for hashed assets Setting up container builds (/configure:container) Auditing static asset caching strategy across a project Profiling frontend performance (browser devtools)
Context
Project root: !pwd
Package files: !find . -maxdepth 1 -name 'package.json'
Next.js config: !find . -maxdepth 1 -name 'next.config.*'
Vite config: !find . -maxdepth 1 -name 'vite.config.*'
Build output: !find . -maxdepth 1 -type d \( -name '.next' -o -name 'dist' -o -name 'out' \)
CDN config: !find . -maxdepth 2 \( -path './vercel.json' -o -path './_headers' -o -path './_redirects' -o -path './public/_headers' \)
Project standards: !find . -maxdepth 1 -name '.project-standards.yaml'
Parameters
Parse from command arguments:
--check-only: Report compliance status without modifications (CI/CD mode)--fix: Apply fixes automatically without prompting--framework <nextjs|vite>: Override framework detection--cdn <cloudflare|vercel|none>: Specify CDN provider for cache header configuration
Execution
Execute this cache-busting configuration check:
Step 1: Detect project framework
Identify the framework from file structure:
Indicator Framework Config File next.config.js or next.config.mjs
next.config.tsNext.js next.config.ts
vite.config.js or vite.config.tsVite vite.config.*
.next/ directoryNext.js (built) Detection only
dist/ directory + vite in package.jsonVite (built) Detection only
Check package.json dependencies for "next" or "vite".
If both detected, prompt user to specify with --framework. If neither detected, report unsupported and exit.
Step 2: Analyze current cache-busting state For the detected framework, read config files and check:
Next.js - Read next.config.js/ts and check:
Vite - Read vite.config.js/ts and check:
Step 3: Detect CDN provider Identify CDN from project files:
Indicator CDN Provider vercel.json existsVercel .vercelignore existsVercel _headers in root or public/Cloudflare Pages _redirects existsCloudflare Pages / Netlify wrangler.toml existsCloudflare Workers/Pages None of the above Generic / None
Step 4: Generate compliance report Print a formatted compliance report:
Cache-Busting Compliance Report
================================
Project: [name]
Framework: [Next.js 14.x | Vite 5.x]
CDN Provider: [Vercel | Cloudflare | None detected]
Framework Configuration:
Config file next.config.js [EXISTS | MISSING]
Asset hashing [hash] in filenames [ENABLED | DISABLED]
Build manifest manifest files [GENERATED | MISSING]
Deterministic builds Build ID configured [PASS | NOT SET]
Compression gzip/brotli enabled [PASS | DISABLED]
Cache Headers:
Static assets immutable, 1y [CONFIGURED | MISSING]
HTML files no-cache, must-revalidate [CONFIGURED | MISSING]
API routes varies by route [CONFIGURED | N/A]
CDN configuration vercel.json/_headers [EXISTS | MISSING]
Build Output (if built):
Hashed filenames app.[hash].js [DETECTED | NOT BUILT]
Content addressing Unique hashes per version [PASS | DUPLICATE]
Manifest integrity Valid manifest.json [PASS | INVALID]
Overall: [X issues found]
Recommendations:
[List specific fixes needed]
If --check-only, stop here.
Step 5: Apply configuration (if --fix or user confirms) Based on detected framework, create or update config files using templates from REFERENCE.md :
Next.js : Update next.config.js/ts with deterministic builds, compression, cache headersVite : Update vite.config.js/ts with content hashing, manifest, chunk splitting
Step 6: Configure CDN cache headers Based on detected CDN provider, create or update cache header configuration using templates from REFERENCE.md :
Vercel : Create/update vercel.json with header rulesCloudflare Pages : Create public/_headers with cache rulesGeneric : Provide nginx configuration reference
Step 7: Add build verification Create scripts/verify-cache-busting.js to verify content hashing works after build. Add package.json scripts for build verification. Use the verification script template from REFERENCE.md .
Step 8: Configure CI/CD verification Add cache-busting verification step to GitHub Actions workflow. Use the CI workflow template from REFERENCE.md .
Step 9: Update standards tracking Update .project-standards.yaml:
standards_version: "2025.1"
last_configured: "[timestamp]"
components:
cache-busting: "2025.1"
cache-busting-framework: "[nextjs|vite]"
cache-busting-cdn: "[vercel|cloudflare|none]"
cache-busting-verified: true
Step 10: Print final report Print a summary of changes applied, cache strategy overview, and next steps for verification.
For detailed configuration templates and code examples, see REFERENCE.md .
Agentic Optimizations Context Command Quick compliance check /configure:cache-busting --check-onlyAuto-fix all issues /configure:cache-busting --fixNext.js project only /configure:cache-busting --fix --framework nextjsVite project only /configure:cache-busting --fix --framework viteCloudflare CDN headers /configure:cache-busting --fix --cdn cloudflareVercel CDN headers /configure:cache-busting --fix --cdn vercel
Output
Compliance report with framework and CDN configuration status
List of changes made (if --fix) or proposed (if interactive)
Verification instructions and commands
CDN cache header examples
Next steps for deployment and monitoring
See Also Mehr aus diesem Repository Install, configure and troubleshoot MCP servers. Use when adding/enabling servers, editing .mcp.json, fixing OAuth, or when a server runs stale code after an upstream fix.
FinOps snapshot — org billing, workflow stats, cache usage. Use when you want a high-level view of CI spending or workflow health before diving deeper.
GitHub Actions billing, workflow efficiency, and waste analysis at org or repo level. Use when investigating CI/CD costs, wasted runs, or optimizing triggers.
