Unable to view the pages/index.vue

[true nebula]

I am new to nuxt.
I just created a new project but I am unable to view the home page even after adding <NuxtPage /> in app.vue

[frigid trench]

Hi @true nebula. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

---

If you have created a new Nuxt project and added a pages/index.vue file, but are unable to view the home page even after adding <NuxtPage /> in app.vue, here are some things to check based on the official documentation:

1. Correct Directory Structure
   Make sure your pages/index.vue file is in the correct location:

   your-project/
   ├─ pages/
   │  └─ index.vue
   └─ app.vue
   

2. Single Root Element in Page
   Each page component (like pages/index.vue) must have a single root element. For example:

   <template>
     <div>
       <h1>Home Page</h1>
     </div>
   </template>
   

   If you have multiple root elements or an HTML comment as the first element, the page may not render correctly during client-side navigation see details.

3. app.vue Setup
   Your app.vue should include the <NuxtPage /> component to render the current page:

   <template>
     <NuxtPage />
   </template>
   

   Or, if you want to add a layout:

   <template>
     <header>Header</header>
     <NuxtPage />
     <footer>Footer</footer>
   </template>
   

   More info

4. Development Server
   Make sure your development server is running. Use:

   npm run dev
   

   Then visit [http://localhost:3000](http://localhost:3000) in your browser see installation guide.

5. No HTML Comments as Root
   Do not start your page template with an HTML comment, as this will break client-side navigation see example.

If you have followed all these steps and still cannot see your home page, please double-check for typos or errors in your file structure and code. If the problem persists, please provide the content of your app.vue and pages/index.vue files for further help.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

@true nebula Kapa.ai is still learning and improving, please let me know how I did by reacting below.

[true nebula]

That didn't solve my issue

[warm grotto]

Pages folder should be inside the app folder if you’re on Nuxt 4

[true nebula]

Ohhh Ok thank you, lemme try that

[true nebula]

OMG, it worked, thanks. I didn't see it in the docs