Nativescript Error : Executing webpack failed with exit code 1

I am developing the Nativescript android and iOS application. Migrated my project I had the following issue

package.json

{
  "description": "Sample",
  "license": "SEE LICENSE IN <your-license-filename>",
  "repository": "<fill-your-repository-here>",
  "dependencies": {
    "@angular-devkit/build-angular": "^13.1.2",
    "@angular/animations": "^12.2.5",
    "@angular/cli": "^13.1.2",
    "@angular/common": "^12.2.5",
    "@angular/compiler": "^12.2.5",
    "@angular/core": "^13.1.1",
    "@angular/forms": "^12.2.5",
    "@angular/http": "8.0.0-beta.10",
    "@angular/platform-browser": "^12.2.5",
    "@angular/platform-browser-dynamic": "^12.2.5",
    "@angular/router": "^12.2.5",
    "@nativescript/angular": "^12.2.0",
    "@nativescript/core": "~8.1.1",
    "@ngtools/webpack": "^13.1.2",
    "@nstudio/nativescript-checkbox": "^1.0.0",
    "@nstudio/nativescript-loading-indicator": "^3.0.1",
    "font-awesome": "^4.7.0",
    "nativescript-accordion": "^6.0.0-beta.2",
    "nativescript-drop-down": "^5.0.4",
    "nativescript-feedback": "^1.3.12",
    "nativescript-geolocation": "^5.1.0",
    "nativescript-iqkeyboardmanager": "^1.5.1",
    "nativescript-ng-ripple": "^2.0.1",
    "nativescript-phone": "^1.4.0",
    "nativescript-plugin-firebase": "9.0.2",
    "nativescript-ratings": "^1.0.1",
    "nativescript-screen-orientation": "^1.0.0",
    "nativescript-theme-core": "~1.0.4",
    "nativescript-ui-listview": "^8.0.1",
    "nativescript-youtubeplayer": "^3.0.1",
    "reflect-metadata": "~0.1.10",
    "rxjs": "~7.3.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular/compiler-cli": "^13.1.1",
    "@nativescript/android": "8.1.1",
    "@nativescript/schematics": "~0.4.0",
    "@nativescript/types": "~8.1.0",
    "@nativescript/webpack": "~5.0.0",
    "postcss": "^8.4.5",
    "typescript": "~4.3.5"
  },
  "readme": "NativeScript Application",
  "main": "./src/main.ts"
}

Error:

webpack is watching the files... file:///sample/node_modules/@angular/compiler-cli/bundles/chunk-FXVUPJ6A.js:1526 import { compileClassMetadata as compileClassMetadata3, compileComponentFromMetadata, compileDeclareClassMetadata as compileDeclareClassMetadata3, compileDeclareComponentFromMetadata, CssSelector, DEFAULT_INTERPOLATION_CONFIG, DomElementSchemaRegistry, ExternalExpr as ExternalExpr5, FactoryTarget as FactoryTarget3, InterpolationConfig, makeBindingParser as makeBindingParser2, ParseSourceFile as ParseSourceFile2, parseTemplate, R3TargetBinder, SelectorMatcher, ViewEncapsulation, WrappedNodeExpr as WrappedNodeExpr5 } from "@angular/compiler"; ^^^^^^^^^^^^^^^^^

SyntaxError: Named export 'ViewEncapsulation' not found. The requested module '@angular/compiler' is a CommonJS module, which may not support all module.exports as named exports. CommonJS modules can always be imported via the default export, for example using:

import pkg from '@angular/compiler'; const { compileClassMetadata: compileClassMetadata3, compileComponentFromMetadata, compileDeclareClassMetadata: compileDeclareClassMetadata3, compileDeclareComponentFromMetadata, CssSelector, DEFAULT_INTERPOLATION_CONFIG, DomElementSchemaRegistry, ExternalExpr: ExternalExpr5, FactoryTarget: FactoryTarget3, InterpolationConfig, makeBindingParser: makeBindingParser2, ParseSourceFile: ParseSourceFile2, parseTemplate, R3TargetBinder, SelectorMatcher, ViewEncapsulation, WrappedNodeExpr: WrappedNodeExpr5 } = pkg;

at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
at async Promise.all (index 0)
at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
at async AngularWebpackPlugin.initializeCompilerCli (/sample/node_modules/@ngtools/webpack/src/ivy/plugin.js:528:34)

Executing webpack failed with exit code 1.

Screenshot:

Screenshot 1:

help me to fix this issue