name: nuxt description: Nuxt 是一个全栈Vue框架,提供服务器端渲染、自动导入和文件路由。适用于Nuxt应用、服务器路由、useFetch、中间件或混合渲染。 metadata: author: Anthony Fu version: “2026.1.28” source: 从 https://github.com/nuxt/nuxt 生成,脚本位于 https://github.com/antfu/skills
Nuxt 是一个全栈Vue框架,提供服务器端渲染、文件路由、自动导入和一个强大的模块系统。它使用Nitro作为服务器引擎,支持在Node.js、无服务器和边缘平台上的通用部署。
此技能基于Nuxt 3.x,生成于2026-01-28。
核心
| 主题 | 描述 | 参考 |
|---|---|---|
| 目录结构 | 项目文件夹结构、约定、文件组织 | core-directory-structure |
| 配置 | nuxt.config.ts, app.config.ts, 运行时配置, 环境变量 | core-config |
| CLI命令 | 开发服务器、构建、生成、预览和实用命令 | core-cli |
| 路由 | 文件路由、动态路由、导航、中间件、布局 | core-routing |
| 数据获取 | useFetch, useAsyncData, $fetch, 缓存, 刷新 | core-data-fetching |
| 模块 | 创建和使用Nuxt模块,Nuxt Kit实用工具 | core-modules |
| 部署 | 使用Nitro的平台无关部署,支持Vercel, Netlify, Cloudflare | core-deployment |
功能
| 主题 | 描述 | 参考 |
|---|---|---|
| 可组合自动导入 | Vue API、Nuxt可组合函数、自定义可组合函数、实用工具 | features-composables |
| 组件自动导入 | 组件命名、懒加载、水合策略 | features-components-autoimport |
| 内置组件 | NuxtLink, NuxtPage, NuxtLayout, ClientOnly等 | features-components |
| 状态管理 | useState可组合函数、SSR友好状态、Pinia集成 | features-state |
| 服务器路由 | API路由、服务器中间件、Nitro服务器引擎 | features-server |
渲染
| 主题 | 描述 | 参考 |
|---|---|---|
| 渲染模式 | 通用(SSR)、客户端(SPA)、混合渲染、路由规则 | rendering-modes |
最佳实践
| 主题 | 描述 | 参考 |
|---|---|---|
| 数据获取模式 | 高效获取、缓存、并行请求、错误处理 | best-practices-data-fetching |
| SSR与水合 | 避免上下文泄漏、水合不匹配、可组合模式 | best-practices-ssr |
高级
| 主题 | 描述 | 参考 |
|---|---|---|
| 层 | 使用可重用层扩展应用 | advanced-layers |
| 生命周期钩子 | 构建时、运行时和服务器钩子 | advanced-hooks |
| 模块创作 | 使用Nuxt Kit创建可发布的Nuxt模块 | advanced-module-authoring |