Pages ​

Definition ​

A Page is the only entry-point for a Route. A Route should never point to anything different than a Page. This is a convention that helps developers find a corresponding route component more easily, while not resorting to file-based routing.

Pages will be rendered into your Layout's <SpireContent/> slot.

Creating a Page ​

A Page, like a Layout, is a normal Vue Component located in /ui/pages.

The main differentiation between a Page and a Component is that a Component can be reusable and should be as self-contained as possible, where a Page only serves as an Entry-Point to a Route and defines its Layout specifically for that Page.

<script setup lang="ts">
// import anything here
</script>

<template>
    <section>
        <!-- use your components here -->
    </section>
</template>