菜单
Cache-busting for Next.js and Vite: content hashing, CDN cache headers. Use when adding Vercel/Cloudflare cache headers or auditing static asset caching.
默认使用会先检查来源的 Prompt；你也可以切换为直接命令，或下载本地副本。
决定是否安装前，请先阅读 SKILL.md，以及 SkillsMP 当前展示的配套文件。
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/laurigates/claude-plugins --skill configure-cache-busting命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
正在显示 SKILL.md
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.
| 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 |
| 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) |
pwdfind . -maxdepth 1 -name 'package.json'find . -maxdepth 1 -name 'next.config.*'find . -maxdepth 1 -name 'vite.config.*'find . -maxdepth 1 -type d \( -name '.next' -o -name 'dist' -o -name 'out' \)find . -maxdepth 2 \( -path './vercel.json' -o -path './_headers' -o -path './_redirects' -o -path './public/_headers' \)find . -maxdepth 1 -name '.project-standards.yaml'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 configurationExecute this cache-busting configuration check:
Identify the framework from file structure:
| Indicator | Framework | Config File |
|---|---|---|
next.config.js or next.config.mjs |
| Next.js |
next.config.* |
next.config.ts | Next.js | next.config.ts |
vite.config.js or vite.config.ts | Vite | vite.config.* |
.next/ directory | Next.js (built) | Detection only |
dist/ directory + vite in package.json | Vite (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.
For the detected framework, read config files and check:
Next.js - Read next.config.js/ts and check:
generateBuildId configured for deterministic buildsassetPrefix configured for CDNcompress: true enabledpoweredByHeader: false for securitygenerateEtags configuredheaders() functionVite - Read vite.config.js/ts and check:
build.rollupOptions.output.entryFileNames uses [hash]build.rollupOptions.output.chunkFileNames uses [hash]build.rollupOptions.output.assetFileNames uses [hash]build.manifest: true for SSR/manifest-based routingbuild.cssCodeSplit configured appropriatelyIdentify CDN from project files:
| Indicator | CDN Provider |
|---|---|
vercel.json exists | Vercel |
.vercelignore exists | Vercel |
_headers in root or public/ | Cloudflare Pages |
_redirects exists | Cloudflare Pages / Netlify |
wrangler.toml exists | Cloudflare Workers/Pages |
| None of the above | Generic / None |
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.
Based on detected framework, create or update config files using templates from REFERENCE.md:
next.config.js/ts with deterministic builds, compression, cache headersvite.config.js/ts with content hashing, manifest, chunk splittingBased on detected CDN provider, create or update cache header configuration using templates from REFERENCE.md:
vercel.json with header rulespublic/_headers with cache rulesCreate 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.
Add cache-busting verification step to GitHub Actions workflow. Use the CI workflow template from REFERENCE.md.
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
Print a summary of changes applied, cache strategy overview, and next steps for verification.
For detailed configuration templates and code examples, see REFERENCE.md.
| Context | Command |
|---|---|
| Quick compliance check | /configure:cache-busting --check-only |
| Auto-fix all issues | /configure:cache-busting --fix |
| Next.js project only | /configure:cache-busting --fix --framework nextjs |
| Vite project only | /configure:cache-busting --fix --framework vite |
| Cloudflare CDN headers | /configure:cache-busting --fix --cdn cloudflare |
| Vercel CDN headers | /configure:cache-busting --fix --cdn vercel |
Provide:
/configure:all - Run all compliance checks/configure:status - Quick compliance overview/configure:workflows - GitHub Actions workflow standards/configure:dockerfile - Container configuration with build caching
基于 SOC 职业分类