Обновление страницы перенаправляет на дом с помощью vue router

У меня возникла проблема с моим проектом vuejs. Я использую vue router в одностраничном приложении. Я могу перейти на любую страницу, используя vue router. Но когда я перезагружаю страницу по любому маршруту, меня перенаправляет на / проекта. Вот код, который я написал для vue router в файле router/index.js.

import Vue from 'vue'
import VueRouter from 'vue-router'
// import store from '../store'
import Home from '../views/Home.vue'
import Login from '@/components/auth/Login.vue'
import Register from '@/components/auth/Register.vue'
import Admin from '@/components/admin/Admin.vue'
import CreateCourse from '@/components/admin/course/CreateCourse.vue'
import Categories from '@/components/admin/Categories.vue'

Vue.use(VueRouter);

function isAuthenticated(to, from, next) {
    // if (store.getters['auth/authenticated']) {
    //     next();
    // } else {
    //     next('/login');
    // }
    next();
}

function isAdmin(to, from, next) {
    // if (store.getters['auth/user'].role === 'super' || store.getters['auth/user'].role === 'admin') {
    //     next();
    // } else {
    //     next('/');
    // }
    next();
}

function isNotAuthenticated(to, from, next) {
    // if (!store.getters['auth/authenticated']) {
    //     next();
    // } else {
    //     next('/');
    // }
    next();
}

const routes = [
    {
        path: '/',
        name: 'Home',
        component: Home,
    },
    {
        path: '/about',
        name: 'About',
        beforeEnter: isAuthenticated,
        component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
    },
    {
        path: '/login',
        name: 'Login',
        component: Login,
        beforeEnter: isNotAuthenticated,
    },
    {
        path: '/register',
        name: 'Register',
        component: Register,
        beforeEnter: isNotAuthenticated,
    },
    {
        path: '/admin',
        name: 'Admin',
        component: Admin,
        beforeEnter: isAdmin,
    },
];

const router = new VueRouter({
    mode: 'history',
    routes
});

export default router

В чем проблема?

Примечание. Закомментированный код предназначен для управления доступом пользователей к определенному маршруту. Я вызываю beforeEnter для каждого маршрута, чтобы проверить, есть ли у пользователя разрешение или нет. Есть ли лучшее решение?