Nativescript cannot find module '@nativescript/angular/router'

I am developing an app using nativescript and angular 11.0. For initial startup creating a login screen. Facing issues while running the application. Get the below exception. The issue happens only when routing is enabled in the module.

ERROR in ./app/login/login.component.ts  Module not found: Error: Can't resolve '@nativescript/angular/router' in 'D:\Mobile_dev\ns-ng-quiz\app-ns-ng\src\app\login'       @ ./app/login/login.component.ts 3:0-64 5:0-51 40:113-132 78:38-57       @ ./app/app.module.ts       @ ./main.ts     

ng update says everything is in order. Deleting node_modules folder and a fresh npm install did not help either.

Here is my package.json

{        "name": "@nativescript/template-hello-world-ng",        "main": "main.js",        "version": "7.0.8",        "author": "NativeScript Team <oss@nativescript.org>",        "description": "NativeScript Application",        "license": "SEE LICENSE IN <your-license-filename>",        "publishConfig": {          "access": "public"        },        "keywords": [          "nativescript",          "mobile",          "angular",          "{N}",          "template"        ],        "repository": {          "type": "git",          "url": "<fill-your-repository-here>"        },        "bugs": {          "url": "https://github.com/NativeScript/NativeScript/issues"        },        "dependencies": {          "@angular/animations": "~11.0.0",          "@angular/common": "~11.0.0",          "@angular/compiler": "~11.0.0",          "@angular/core": "~11.0.0",          "@angular/forms": "~11.0.0",          "@angular/platform-browser": "~11.0.0",          "@angular/platform-browser-dynamic": "~11.0.0",          "@angular/router": "~11.0.0",          "@nativescript/angular": "~11.0.0",          "@nativescript/core": "~7.0.0",          "@nativescript/theme": "~3.0.0",          "reflect-metadata": "~0.1.12",          "rxjs": "^6.6.0",          "zone.js": "~0.11.1"        },        "devDependencies": {          "@angular/compiler-cli": "~11.0.0",          "@nativescript/android": "7.0.1",          "@nativescript/types": "~7.0.0",          "@nativescript/webpack": "~3.0.0",          "@ngtools/webpack": "~11.0.0",          "typescript": "~4.0.0"        },        "private": "true",        "scripts": {          "test": "echo \"Error: no test specified\" && exit 1"        }      }  

Here is my app-routing.module.ts

import { LoginComponent } from './login/login.component';  import { HomeComponent } from './home/home.component';  import { NgModule } from "@angular/core";  import { Routes } from "@angular/router";  import { NativeScriptRouterModule } from "@nativescript/angular";    import { ItemsComponent } from "./item/items.component";  import { ItemDetailComponent } from "./item/item-detail.component";    const routes: Routes = [            {path: "", redirectTo: "/login", pathMatch: "full" },      {path:"login", component:LoginComponent},      {path:"home", component:HomeComponent}     //{ path: "", redirectTo: "/items", pathMatch: "full" },     // { path: "items", component: ItemsComponent },     // { path: "item/:id", component: ItemDetailComponent }       ];    @NgModule({      imports: [NativeScriptRouterModule.forRoot(routes,{          enableTracing:true      })],      exports: [NativeScriptRouterModule]  })  export class AppRoutingModule { }  

Project Structure in VSCode

https://stackoverflow.com/questions/65490986/nativescript-cannot-find-module-nativescript-angular-router December 29, 2020 at 06:53PM