Nuxt Directory Structure · Nuxt Directory Structure v4

Nuxt applications have a specific directory structure that is used to organize the code. This structure is designed to be easy to understand and to be used in a consistent way.
The root directory of a Nuxt application is the directory that contains the nuxt.config.ts file. This file is used to configure the Nuxt application.
The app/ directory is the main directory of the Nuxt application. It contains the following subdirectories:
This directory also includes specific files:
The public/ directory is the directory that contains the public files of the Nuxt application. Files contained within this directory are served at the root and are not modified by the build process.
This is suitable for files that have to keep their names (e.g. robots.txt) or likely won't change (e.g. favicon.ico).
The server/ directory is the directory that contains the server-side code of the Nuxt application. It contains the following subdirectories:
The shared/ directory is the directory that contains the shared code of the Nuxt application and Nuxt server. This code can be used in both the Vue app and the Nitro server.
The test/ directory is the recommended place for application tests (unit, Nuxt runtime, and end-to-end). See Organizing Your Tests for layout and setup details.
The content/ directory is enabled by the Nuxt Content module. It is used to create a file-based CMS for your application using Markdown files.
The modules/ directory is the directory that contains the local modules of the Nuxt application. Modules are used to extend the functionality of the Nuxt application.
The layers/ directory allows you to organize and share reusable code, components, composables, and configurations. Layers within this directory are automatically registered in your project.
Stay updated on new releases and features, guides, and community updates.
Copyright © 2016-2026 Nuxt - MIT License