Как отделить авторизацию от основого кода?

<template>

  <Header/>
    <div class="app">

        <!-- Sidebar -->
        <Sidebar />

        <!-- Content -->
        <router-view />
    </div>
</template>

Вот шаблон App.vue

import { createRouter, createWebHistory } from 'vue-router'
import Home from '../views/Home.vue'

const router = createRouter({
    history: createWebHistory(),
    routes: [
        {
            path: '/',
            component: Home
        },
        {
            path: '/about',
            meta: {requiredAuth: true},
            component: () => import('../views/About.vue')
        },{
            path: '/shop',
            meta: {requiredAuth: true},


            component: () => import('../views/Shop.vue')
        },{
            path: '/product-coming',
            meta: {requiredAuth: true},


            component: () => import('../views/Product-coming.vue')
        },{
            path: '/product-out',
            meta: {requiredAuth: true},


            component: () => import('../views/Product-out.vue')
        },{
            path: '/products',
            meta: {requiredAuth: true},


            component: () => import('../views/Products.vue')
        },{
            path: '/clients',
            meta: {requiredAuth: true},


            component: () => import('../views/Clients.vue')
        },{
            path: '/users',
            meta: {requiredAuth: true},


            component: () => import('../views/Users.vue')
        },{
            path: '/finances',
            meta: {requiredAuth: true},


            component: () => import('../views/Finances.vue')
        },{
            name: "Auth",
            path: '/login',
            meta: {requiredAuth: false},


            component: () => import('../components/Auth.vue')
        },{
            path: '/contragents',
            meta: {requiredAuth: true},

            component: () => import('../views/Сontragents.vue')
        },
    ],
})
router.beforeEach((to, from, next) => {
    if (to.matched.some(record => record.meta.requiredAuth)) {
        // this route requires auth, check if logged in
        // if not, redirect to login page.

            next({ name: 'Auth' })

    } else {
        next() // does not require auth, make sure to always call next()!
    }
})
export default router

Роутер. И вот когда заходит не авторизированый юзер, его перекидывает на страницу авторизации, но при этом шапка сайта, меню - показывает также в авторизации. Я хочу чтобы авторизация была без шапки и меню