Nuxt 目录结构

Nuxt 应用具有特定的目录结构，用于组织代码。这种结构旨在易于理解并以一致的方式使用。

根目录

Nuxt 应用的根目录是包含 nuxt.config.ts 文件的目录。该文件用于配置 Nuxt 应用。

App 目录

app/ 目录是 Nuxt 应用的主目录。它包含以下子目录：

• assets/：构建工具（Vite 或 webpack）将处理的网站资源文件
• components/：应用中的 Vue 组件
• composables/：添加你的 Vue 组合式函数
• layouts/：包装页面并避免在页面间重新渲染的 Vue 组件
• middleware/：在导航到特定路由之前运行的代码
• pages/：基于文件的路由，用于在 Web 应用中创建路由
• plugins/：在 Nuxt 应用创建时使用 Vue 插件及更多功能
• utils/：添加可在组件、组合式函数和页面中使用的全局函数。

该目录还包括以下特定文件：

• app.config.ts：应用内的响应式配置
• app.vue：Nuxt 应用的根组件
• error.vue：Nuxt 应用的错误页面

Public 目录

public/ 目录包含 Nuxt 应用的公共文件。此目录中的文件在根路径下提供，且不会被构建过程修改。

这适用于那些必须保持名称不变的文件（例如 robots.txt）或者基本不会更改的文件（例如 favicon.ico）。

Server 目录

server/ 目录包含 Nuxt 应用的服务器端代码。它包含以下子目录：

• api/：包含应用的 API 路由。
• routes/：包含应用的服务器路由（例如动态 /sitemap.xml）。
• middleware/：在处理服务器路由之前运行代码
• plugins/：在 Nuxt 服务器创建时使用插件及更多功能
• utils/：添加可在服务器代码中使用的通用函数。

Shared 目录

shared/ 目录包含 Nuxt 应用和 Nuxt 服务器的共享代码。这些代码既可以在 Vue 应用中使用，也可以在 Nitro 服务器中使用。

Content 目录

content/ 目录由Nuxt Content模块启用。它用于通过 Markdown 文件为你的应用创建基于文件的 CMS。

Modules 目录

modules/ 目录包含 Nuxt 应用的本地模块。模块用于扩展 Nuxt 应用的功能。

Layers 目录

layers/ 目录允许你组织和共享可复用的代码、组件、组合式函数和配置。此目录中的层会自动注册到你的项目中。

Nuxt 文件

• nuxt.config.ts 文件是 Nuxt 应用的主配置文件。
• .nuxtrc 文件是配置 Nuxt 应用的另一种语法（对于全局配置很有用）。
• .nuxtignore 文件用于在构建阶段忽略根目录中的文件。