PuffercatApps/src/views/TabsPage.vue

<template>
  <ion-page>
    <ion-tabs>
      <ion-router-outlet></ion-router-outlet>
      <ion-tab-bar slot="bottom">
        <ion-tab-button tab="apps" href="/tabs/apps">
          <ion-icon :icon="apps" />
          <ion-label>Apps</ion-label>
        </ion-tab-button>
          
        <ion-tab-button tab="soon" href="/tabs/soon">
          <ion-icon :icon="time" />
          <ion-label>Coming Soon</ion-label>
        </ion-tab-button>
      </ion-tab-bar>
    </ion-tabs>
  </ion-page>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
import { IonTabBar, IonTabButton, IonTabs, IonLabel, IonIcon, IonPage, IonRouterOutlet } from '@ionic/vue';
import { ellipse, square, triangle, apps, time } from 'ionicons/icons';

export default defineComponent({
  name: 'TabsPage',
  components: { IonLabel, IonTabs, IonTabBar, IonTabButton, IonIcon, IonPage, IonRouterOutlet },
  setup() {
    return {
      ellipse, 
      square, 
      triangle,
      apps,
      time,
    }
  }
});
</script>