القائمة
用于创建或审查 Nuxt 3 项目、文件路由、pages、layouts、SSR/SSG/SPA 行为、Nuxt 数据获取、route middleware、plugins、modules、server routes 或 Nuxt 特定 Vue 3 约定。通用 Vue 组件架构另按项目 Vue 约定处理；中文触发词包括 Nuxt、Nuxt 3。
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
| name | fec-nuxt-project-standard |
| description | 用于创建或审查 Nuxt 3 项目、文件路由、pages、layouts、SSR/SSG/SPA 行为、Nuxt 数据获取、route middleware、plugins、modules、server routes 或 Nuxt 特定 Vue 3 约定。通用 Vue 组件架构另按项目 Vue 约定处理；中文触发词包括 Nuxt、Nuxt 3。 |
适用于使用 Nuxt 3 + Vue 3 + TypeScript 的仓库。
规范 Nuxt 3 项目中 SSR/SSG 渲染模式、组合式 API、自动导入、数据获取、路由中间件和模块插件的工程实践，确保约定式开发和类型安全。
window 或 document。useFetch / useAsyncData，并检查水合一致性。├── app.vue # 根组件
├── nuxt.config.ts # Nuxt 配置
│
├── pages/ # 基于文件的路由
│ ├── index.vue # /
│ ├── login.vue # /login
│ ├── dashboard/
│ │ ├── index.vue # /dashboard
│ │ └── users/
│ │ ├── index.vue # /dashboard/users
│ │ └── [id].vue # /dashboard/users/:id
│ └── [...slug].vue # 捕获所有
│
├── layouts/ # 布局
│ ├── default.vue
│ └── auth.vue
│
├── components/ # 自动导入组件
│ ├── Button/
│ │ └── Button.vue
│ └── AppHeader.vue
│
├── composables/ # 组合式函数（自动导入）
│ ├── useAuth.ts
│ └── useFetch.ts
│
├── server/ # 服务端 API
│ ├── api/ # API 路由
│ │ └── users/
│ │ └── index.get.ts
│ ├── middleware/ # 服务端中间件
│ └── utils/ # 服务端工具
│
├── plugins/ # 插件
│ └── i18n.client.ts
│
├── middleware/ # 路由中间件
│ └── auth.ts
│
├── public/ # 静态资源
├── assets/ # 需构建的资源
└── types/ # 类型定义
| 模式 | 配置 | 说明 |
|---|---|---|
| SSR | 默认 | ssr: true |
| SSG | nuxt generate | 预渲染所有页面 |
| SPA | ssr: false | 纯客户端渲染 |
// nuxt.config.ts
export default defineNuxtConfig({
ssr: true, // 或 false
});
useFetch / useAsyncData：服务端 + 客户端，自动去重$fetch：直接请求，适合服务端或一次性调用useLazyAsyncData：不阻塞导航，适合非首屏setup 顶层混用同步/异步逻辑导致水合不匹配pages/ 下文件自动生成路由[id].vue、[...slug].vuelayout 选项或 layouts/default.vue 默认pages/parent/child.vue 需配合 NuxtPagemiddleware/ 下文件自动注册definePageMeta({ middleware: ['auth'] })nuxt.config.ts 的 router.middlewareserver/middleware/plugins/*.ts，支持 .client、.server 后缀modules/ 或 node_modules，在 nuxt.config 中 modules: []window、documentuseState 共享状态时注意 SSR 序列化NuxtImg，链接使用 NuxtLinksetup 顶层使用 await 导致阻塞，优先用 useAsyncData / useFetchpages/ 约定式路由组织，动态路由正确配置nuxt.config.ts 配置清晰useFetch / useAsyncData，自动去重和水合用于生成或编辑图表、图形资产、海报、UI 样机、产品图、信息图、学术图、漫画、头像、分镜、品牌板或图像编辑工作流，尤其是导出 PNG 需要视觉质检和有限自动修复时。文字密集图表优先使用确定性的 Mermaid/SVG/HTML/canvas 源；浏览器可打开的技术图优先使用 HTML technical diagrams，覆盖系统蓝图、架构图、部署拓扑、Agent runtime、memory flow、before-after architecture、流程、序列、数据流、生命周期、runbook、PII/数据血缘和状态机；不要用于不涉及生成图像的普通 UI 打磨。中文触发词包括 图片生成、图像编辑、图表生成、架构图、系统蓝图、部署拓扑、Agent runtime、memory flow、before-after architecture、工作流图、数据流、生命周期图、状态机、ER 图、UML、序列图、海报、UI 样机、产品图、信息图、学术图、漫画、头像、分镜、品牌板、PNG 自检、自动修复。
Use when generating or editing diagrams, charts, visual assets, posters, UI mockups, product images, infographics, academic figures, comics, avatars, storyboards, brand boards, or image-edit workflows, especially when exported PNGs need visual QA and bounded self-repair. Prefer deterministic Mermaid/SVG/HTML/canvas sources for text-heavy diagrams; use HTML technical diagrams for browser-ready system blueprints, architecture, deployment topology, agent runtime, memory flow, before-after architecture, workflow, sequence, data-flow, lifecycle, runbook, PII/data-lineage, and state-machine diagrams. Do not use for ordinary UI polish without generated imagery.
用于创建带 draw.io / diagrams.net 源文件的可编辑技术图，包括架构图、ERD、UML、序列图、流程图、ML 模型图、官方形状检索、品牌符号、Graphviz 自动布局、代码结构图、.drawio 校验或 draw.io CLI 导出兜底。不要用于普通位图生成、手绘草图、交互式 Canvas/Three.js 场景或装饰性 SVG 动画；中文触发词包括 draw.io、diagrams.net、可编辑架构图、.drawio、ER 图、UML、序列图、自动布局、形状检索、代码结构图。
Use when creating editable technical diagrams with draw.io / diagrams.net sources, including architecture diagrams, ERD, UML, sequence diagrams, flowcharts, ML model diagrams, official shape lookup, brand symbols, Graphviz auto-layout, codebase structure maps, .drawio validation, or draw.io CLI export fallback. Do not use for ordinary raster image generation, freehand sketches, interactive canvas/Three.js scenes, or decorative SVG animation. Chinese triggers include draw.io, diagrams.net, editable architecture diagrams, .drawio, ER diagrams, UML, sequence diagrams, auto layout, shape retrieval, code structure diagrams.
用于审查或改进前端无障碍、语义结构、键盘支持、焦点管理、ARIA 标签、屏幕阅读器行为、WCAG 2.2 问题、触控无障碍或辅助技术回归；中文触发词包括 无障碍、accessibility、a11y、WCAG、屏幕阅读器。
用于从参考系统中吸收想法、能力、工作流、架构、质量体系、生态扩展或工程实践，并通过原创的项目内重设计转化为当前项目能力，而不是复制原实现。