Vue Router addRoute blank at router-view - vue.js

Question

First, sorry for my bad english.
I'm learning about modular architecture / Folder By Feature in vue just like this
enter image description here
In user module I created a router like this
enter image description here
And add user's router to main router like this
enter image description here
Builder router is my apps routing after user logged in. And my main router is like this
enter image description here
What's happening is everything works fine when I access /dashboard or /about or other page that defined main router. And I click the /user router (it cames from user's module router) and it also work fine. But when I access /dashboard again. the router view show nothing (it is <!-- --> in dev console).
It's OK when access dashboard. Page displayed (white boxes)
enter image description here
Also OK in user module router
enter image description here
It became blank when I access /dashboard again
enter image description here
The structure of router-view
<router-view> Page Loader
<router-view> Module Loader (Index, Add, Edit)
This is my main router
const routes: Array<RouteRecordRaw> = [
{
path: '/',
name: 'Builder',
component: Builder,
meta: {
requiresAuth: true
},
redirect: '/dashboard',
children: [
{
path: 'dashboard',
name: 'Dashboard',
meta: {
pageTitle: 'Dashboard',
requiresAuth: true
},
component: () => import(/* webpackChunkName: "dashboard" */ '../views/Dashboard.vue')
},
{
path: 'about',
name: 'About',
meta: {
pageTitle: 'About',
requiresAuth: true,
breadcrumb: [
{
label: 'About',
to: '/about'
}
]
},
component: () => import(/* webpackChunkName: "about" */ '#/views/About.vue')
},
]
};
const router = createRouter({
history: createWebHistory(process.env.BASE_URL),
routes
})
export default router
Registering Route
import router from '../router/index'
import store from '../store/index'
const registerModule = (name, module: any) => {
if (module.store) {
store.registerModule(name, module.store)
}
if (module.router) {
module.router.forEach(item => {
router.addRoute('Builder', item)
})
}
}
export const registerModules = (modules: any) => {
Object.keys(modules).forEach(moduleKey => {
const module = modules[moduleKey]
registerModule(moduleKey, module)
})
}
User Module Route
const moduleRoute = [{
path: '/user',
name: 'User',
component: () => import(/* webpackChunkName: "user" */ '../user/Module.vue'),
meta: {
pageTitle: 'User Management Builder',
requiresAuth: true,
breadcrumb: [
{
label: 'User',
to: '/user'
}
]
},
children: [
{
path: 'list',
name: 'UserList',
meta: {
pageTitle: 'User Management',
requiresAuth: true,
breadcrumb: [
{
label: 'User',
to: '/user'
}
]
},
component: () => import(/* webpackChunkName: "user" */ '../user/views/Index.vue')
},
{
path: 'add',
name: 'UserAdd',
meta: {
pageTitle: 'User Add',
requiresAuth: true,
breadcrumb: [
{
label: 'User',
to: '/user'
}
]
},
component: () => import(/* webpackChunkName: "user" */ '#/modules/user/views/Add.vue')
}
]
}]
export default moduleRoute
Extra Note:
I'm using webpack too in case it it affects my problem
Any help please. Thank you in advance.