SuperAPI AI 工具集

vue-nuxt

前端与建站

查看项目

更新于 10-16 08:07

技能介绍

用途:该技能专注 Nuxt 3 架构与全栈 Vue 应用开发,覆盖 SSR/SSG、Nitro 服务端、模块、自动导入和部署策略。参数包含 topic(config、ssr、ssg、api、modules、deploy、all)、level(beginner、intermediate、advanced),以及可选的 hosting(vercel、netlify、cloudflare、node)与 rendering(ssr、ssg、hybrid)。

主要能力:分五个模块。基础部分涵盖 nuxi create 安装、nuxt.config.ts 配置、pages/ 与 components/ 目录、自动导入与 Nuxt DevTools;路由部分讲解基于文件的路由约定,包括静态、动态 [id]、通配 [...slug]、可选 [[optional]] 与嵌套路由,以及 definePageMeta 设置布局、中间件和标题;数据获取部分对比 useFetch、useAsyncData、useLazyFetch 与 $fetch 的适用场景;服务端部分用 Nitro 在 server/api 下按 users.get.ts、users.post.ts、[id].ts 等命名创建接口,并支持 server/middleware 与 server/utils;渲染与部署部分说明 SSR、SSG、SPA 与混合渲染的配置差异,以及 Vercel、Netlify、Cloudflare、Node 的预设。

使用方式:通过 Skill("vue-nuxt") 调用,按模块顺序学习并完成练习与检查点。前置技能为 vue-fundamentals 与 vue-composition-api,相关技能包括 vue-testing、vue-typescript。

限制:资料未提供具体收费、价格与平台支持范围;示例代码与配置需以官方文档为准,排错部分仅列出常见问题与调试步骤。