vue-router navigation is not working and getting error: ChunkLoadError: Loading chunk failed after npm run build

Question

I am new learner of vue js 3. Recently I have come up with a strange problem. The problem is related to vue-router using with vue js 3. Problem: route navigation is not working at local (http://localhost:4000). I am getting error on browser console: ChunkLoadError: Loading chunk src_views_client_smppProfile_SMPPProfile_vue failed.

vue-router.mjs:3472 ChunkLoadError: Loading chunk src_views_client_smppProfile_SMPPProfile_vue failed.
(error: http://localhost:4000/client/js/src_views_client_smppProfile_SMPPProfile_vue.js)
    at __webpack_require__.f.j (app.js:2037:29)
    at app.js:1494:40
    at Array.reduce (<anonymous>)
    at __webpack_require__.e (app.js:1493:67)
    at fn.e (app.js:1693:50)
    at component (index.js:53:1)
    at extractComponentsGuards (vue-router.mjs:2099:1)
    at eval (vue-router.mjs:3303:1)

Actually before running npm run build, it was fine. But after that I am facing this issue. I have google it. Somewhere I get to know that it is because of browser cache. But I couldn't get rid of it.

Here is my route's index.js file

import { createRouter, createWebHistory } from "vue-router";

const routes = [
    {
        path: "/login",
        name: "login",
        component: () => import("../views/login/LoginView.vue"),
    },
    //error
    {
        path: "/forbidden",
        name: "ForbiddenPage",
        component: () => import("../components/utilComponents/Forbidden.vue"),
    }
]
const router = createRouter({
    history: createWebHistory(process.env.BASE_URL),
    routes,
});

Could anyone please give me any idea why this issue is occurring and How can I solve it.??