Customising app.vue

This module provides a default app.vue file for when one is not otherwise provided by your app.

If you need to customize this app.vue file, you can create a new one in your project's source directory, based off the default:

<template>
  <ion-app>
    <ion-router-outlet />
  </ion-app>
</template>

This module will then stop providing one, so that your project's app.vue is used instead.

Necessary ion tags

It's necessary that <ion-app> and <ion-router-outlet> are provided in your app.vue for Ionic to function.

<ion-app> is the container element of Ionic - there should be only one per project - and is required for certain behaviours to work. Please see the Ionic ion-app documentation for more info.

Equally, <ion-router-outlet> provides a mounting point for the route component. In regular Nuxt applications, this would be <NuxtPage />, but as Ionic Router is handling our routing we must use the <ion-router-outlet>.