Router-links is broken in vue project while links work fine in reality

Question

I have my vue project with different router-links. When I build it for hosting and try to check my links using Link Checker it says all my internal links are broken while all internal links work well and bring the user to the proper page in reality.

When I try to check all my links locally on my computer using Link Checker all links are fine.

I would appreciate it if someone helps me figure out what kind of problem it is.

There is my code below:

import {createRouter, createWebHistory} from 'vue-router'
import Main from '../static/Main'

const routes = [
    {
        path: '/',
        name: 'Main',
        component: Main
    },
    {
        path: '/about-us/',
        name: 'about-us',
        component: () => import('../static/AboutUs')
    },
    {
        path: '/about/',
        redirect: '/about-us/'
   },
]

const router = createRouter({
    history: createWebHistory(process.env.BASE_URL),
    routes,
    scrollBehavior: function(to, from, savedPosition) {
        window.scrollTo({ top: 0, behavior: 'smooth' });
    },

})

Answer 1

Change /about-us/ to /about-us and /about/ to /about.