在正式开发之前，我们先了解下 nuxt 的一些基础理论知识。
文件构成
.
├── README.md
├── app.vue # nuxt 应用程序主组件（入口组件）
├── nuxt.config.ts # nuxt 配置文件（该文件配置可覆盖默认的配置-一方面可以覆盖，一方面扩展）
├── package.json # 项目包配置文件
├── pnpm-lock.yaml # pnpm 版本锁定控制文件
├── public
│ └── favicon.ico
├── server
│ └── tsconfig.json
└── tsconfig.json # ts 配置文件上边这些，只是使用工具创建的默认文件。一个完整的项目，远远不止这些文件夹、文件、配置。 可见官方文档。
https://nuxt.com/docs/guide/directory-structure/nuxt
我们先了解几个比较用的到的。
总是以项目根目录来说起哈。
.nuxt # 该文件夹存放生成的 vue 文件，这个不需要手动建立
.output # 该文件夹是构建应用程序时，存放生产文件的文件夹。
assets # 该文件夹同传统 vue 项目类似，用于存放静态资源(css，图片，字体等)。生产时，会通过 `vite` 同工具打包。
components # 存放 vue 组件的地方，nuxt 会自动导入
composables # 存放 vue 可组合使用的文件。文档有示列。
layouts # 存放自定义布局框架，抽取共同部分的地方。对于一个网站，这个是必须的。也是很多框架程序要抽象出来的一种实现。
middleware # 中间件。这个也是很多框架程序要抽象出来的一种实现。无论是 php的框架、go 的框架、java 的框架，这个是很有必要的。
pages # 用于存放 vue 等文件的地方（也可以是 ts, tsx等）。约定大于配置。默认该文件夹下的文件以及文件夹就已经开始对应路由了。该文件夹也不是必须的，但常规项目还是必须的。
server # 该文件夹存放 api （中间件）等服务。每个文件都应导出使用 defineEventHandler（） 或 eventHandler（）（别名）定义的默认函数。应详细阅读官方文档。
utils # 该文件夹存放辅助函数程序
.env # 环境变量配置，通常会有 .env.local .env.production 这些配置。使用时，应阅读文档，并小心使用
.gitignore # git 版本控制忽略的文件。官方文档给出了必须的配置，请移步官方文档
app.config.ts # 该程序的配置。在生命周期内运行时可以更新和使用它。可以是 .tx,.js .mjs 文件。使用 defineAppConfig 等定义。nuxt.config.ts 常见配置可参考 https://nuxt.com/docs/getting-started/configuration， 比如 tailwindcss、eslint 这些。
API
想要使用好 nuxt，就得多去了解和尝试。尝试多了，了解多了，就会有一套最佳使用方案。此刻，我也是在学习中呀。
在使用数据请求前，可以暂时先不了解这些。如果刚开始，就把整个工具条条框框的了解个透，会很心累。还是先做做项目，从实践中来熟练吧。
https://nuxt.com/docs/api/composables/use-app-config
components
上边 api 可以跳过，components 不可过。对于前端页面，对于页面，首先看到的就是页面，所以 nuxt 的自己的组件是比必须先要了解一些。不需要每个都透，要知道是干啥的就可以。
这里的组件和 vue 的组件很像很像。只是这个是 nuxt 官方天生的。
NuxtPage # NuxtPage是Nuxt附带的内置组件。NuxtPage需要显示位于pages/目录中的顶级或嵌套页面。
NuxtLayout # 用来使用自定义布局的
NuxtLink # 处理路由跳转链接的。 是 Vue Router 的 RouterLink 组件和 HTML 标签的直接替代品
NuxtLoadingIndicator # 在页面导航上显示一个进度条
Teleport # 穿梭穿梭，这个和 vue3 里的一样先初步了解这么多。下边开始真正的项目配置和建立项目了。光看理论文档，很难记住，也很难形成映象。都从实践中开始吧。
官方支持推荐的插件
打开了解，喵一眼，看看都有啥