Hi i need to use module within lazy module and load component into that so i modified sample from this repository bu i am getting the issue

core.umd.js?e2a5:3462 EXCEPTION: Uncaught (in promise): Error: Cannot match any routes: 'sync' Error: Cannot match any routes: 'sync'

sync.module.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AboutComponent } from './about.component';
const routes: Routes = [
{ path: 'sync', component: AboutComponent },
];@NgModule({
imports: [
RouterModule.forChild(routes)
],
exports: [],
declarations: [AboutComponent],
providers: [],
})
export class SyncModule { }

about.module.ts
import { NgModule } from '@angular/core';

import { AboutRoutingModule } from './about.routing';

import { AboutComponent } from './about.component';

@NgModule({
imports: [
AboutRoutingModule
],
exports: [],
declarations: [AboutComponent],
providers: [],
})
export class AboutModule { }

about.routing.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { AboutComponent } from './about.component';

const routes: Routes = [
{ path: 'sync', loadChildren: './sync.module#SyncModule' },
{ path: '', redirectTo: '/sync', pathMatch: 'full' }
];

@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
})
export class AboutRoutingModule { }

app.component.html

< a routerLink="/home" routerLinkActive="active">Home < a routerLink="/about" routerLinkActive="active">About (lazy) < a routerLink="/sync" routerLinkActive="active">Sync