0

Please help as I am having error after upgrade my global @angular/cli to version 11. I have revert back to version 8. But now this error keep appear when I try to compile. I suspect is the version compatibility or mat-angular issue. I have already try to delete the node modules and reinstall using npm install. I have also try to use npm cache clean but still no result. I have follow the advice from this post. But the error still happen. Please advice.

fail: Microsoft.AspNetCore.SpaServices[0]
      ERROR in ./node_modules/@angular/material/esm2015/select.js 104:4-33
"export '╔╡╔╡classMapInterpolate1' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/material/esm2015/stepper.js 368:8-37
"export '╔╡╔╡classMapInterpolate1' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/material/esm2015/table.js 84:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/material/esm2015/table.js 85:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/material/esm2015/table.js 86:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/material/esm2015/table.js 344:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/material/esm2015/table.js 371:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/material/esm2015/table.js 398:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/material/esm2015/tree.js 305:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/cdk/esm2015/table.js 621:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/cdk/esm2015/table.js 645:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/cdk/esm2015/table.js 669:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/cdk/esm2015/table.js 2215:8-33
"export '╔╡╔╡elementContainer' (imported as '╔╡ngcc0') was not found in '@angular/core'
ERROR in ./node_modules/@angular/cdk/esm2015/table.js 2216:8-33

Below is my global angular cli version

Angular CLI: 8.3.21
Node: 12.16.3
OS: win32 x64
Angular: 8.1.3
... common, core, language-service, service-worker

Package                             Version
-------------------------------------------------------------
@angular-devkit/architect           0.803.21
@angular-devkit/build-angular       0.803.21
@angular-devkit/build-optimizer     0.803.21
@angular-devkit/build-webpack       0.803.21
@angular-devkit/core                8.3.6
@angular-devkit/schematics          8.3.21
@angular/animations                 8.2.14
@angular/cdk                        8.2.3
@angular/cli                        8.3.21
@angular/compiler                   8.2.8
@angular/compiler-cli               8.2.8
@angular/flex-layout                7.0.0-beta.24
@angular/forms                      8.2.8
@angular/http                       7.2.15
@angular/material                   8.2.3
@angular/material-moment-adapter    8.2.3
@angular/platform-browser           8.1.0
@angular/platform-browser-dynamic   8.2.8
@angular/pwa                        0.803.21
@angular/router                     8.2.8
@ngtools/webpack                    8.3.21
@schematics/angular                 8.3.21
@schematics/update                  0.803.21
rxjs                                6.5.4
typescript                          3.4.5
webpack                             4.39.2

This is my local node module

{
  "name": "ec.inventory.api",
  "version": "1.1.179",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "prebuild": "npm version patch",
    "build": "ng build --aot",
    "build:ssr": "ng run EC.Inventory.API:server:dev",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular-devkit/core": "8.3.6",
    "@angular/animations": "^8.2.14",
    "@angular/cdk": "8.2.3",
    "@angular/cli": "^8.3.21",
    "@angular/common": "8.1.3",
    "@angular/compiler": "8.2.8",
    "@angular/core": "8.1.3",
    "@angular/flex-layout": "^7.0.0-beta.19",
    "@angular/forms": "8.2.8",
    "@angular/http": "^7.2.15",
    "@angular/material": "^8.2.3",
    "@angular/material-moment-adapter": "^8.2.3",
    "@angular/platform-browser": "8.1.0",
    "@angular/platform-browser-dynamic": "8.2.8",
    "@angular/pwa": "^0.803.21",
    "@angular/router": "8.2.8",
    "@angular/service-worker": "8.1.3",
    "@aspnet/signalr": "^3.0.0-preview6.19307.2",
    "@covalent/core": "^2.1.1",
    "@kolkov/angular-editor": "^1.1.1",
    "@ng-bootstrap/ng-bootstrap": "^5.1.0",
    "angular-bootstrap-md": "^8.1.1",
    "angular2-jwt": "^0.2.3",
    "angular2-signaturepad": "^2.11.0",
    "bootstrap": "4.3.1",
    "bootstrap-material-design": "4.1.2",
    "bootstrap-notify": "3.1.3",
    "core-js": "^2.6.11",
    "crypto-js": "^3.1.9-1",
    "date-fns": "^2.8.1",
    "fingerprintjs2": "^1.8.1",
    "hammerjs": "^2.0.8",
    "moment": "^2.24.0",
    "ng-lottie": "^0.3.2",
    "ng-pick-datetime": "^7.0.0",
    "ng-simple-google-login": "0.0.2",
    "ng2-charts": "^2.3.0",
    "ng2-pdf-viewer": "^5.3.4",
    "ngx-barcode": "^0.2.4",
    "ngx-mask": "^8.1.7",
    "node-sass": "^4.12.0",
    "rxjs": "^6.5.4",
    "rxjs-compat": "^6.5.4",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.21",
    "@angular/compiler-cli": "8.2.8",
    "@angular/language-service": "8.1.3",
    "@types/bootstrap": "4.3.0",
    "@types/chartist": "^0.9.37",
    "@types/jasmine": "~2.5.53",
    "@types/jasminewd2": "^2.0.8",
    "@types/jquery": "^3.3.22",
    "@types/node": "^6.0.118",
    "codelyzer": "^5.2.1",
    "jasmine-core": "~2.6.2",
    "jasmine-spec-reporter": "~4.1.0",
    "karma": "~1.7.0",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~3.2.0",
    "tslint": "~5.7.0",
    "typescript": "3.4.5"
  },
  "optionalDependencies": {
    "node-sass": "^4.9.3",
    "protractor": "~5.4.0",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1"
  }
}

Try the command as suggested

npm install -S @angular/material @angular/cdk @angular/animations

npm uninstall @angular/core

npm install -S @angular/core

But show the below error while installing

$ npm install -S @angular/material @angular/cdk @angular/animations
npm WARN @angular/[email protected] requires a peer of @angular/cdk@^7.0.0-rc.0 but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN @covalent/[email protected] requires a peer of @angular/common@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @covalent/[email protected] requires a peer of @angular/core@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @covalent/[email protected] requires a peer of @angular/forms@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @covalent/[email protected] requires a peer of @angular/router@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @covalent/[email protected] requires a peer of @angular/cdk@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @covalent/[email protected] requires a peer of @angular/material@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/core@^2.0.0||^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/http@^2.0.0||^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of rxjs@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of [email protected] - 3 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/cdk@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/common@^8.2.14 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/core@^8.2.14 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of chart.js@^2.9.3 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/core@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of rxjs@^5.1.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of zone.js@^0.8.4 but none is installed. You must install peer dependencies yourself.
npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself.
npm WARN The package protractor is included as both a dev and production dependency.
npm WARN The package ts-node is included as both a dev and production dependency.
npm WARN The package tslint is included as both a dev and production dependency.

npm ERR! code EPERM
npm ERR! syscall unlink
npm ERR! path C:\Users\shawn\Desktop\BP_eClinic\EC.Inventory.API\ClientApp\node_modules\@angular\material\typings
npm ERR! errno -4048
npm ERR! Error: EPERM: operation not permitted, unlink 'C:\Users\shawn\Desktop\BP_eClinic\EC.Inventory.API\ClientApp\node_modules\@angular\material\typings'
npm ERR!  [OperationalError: EPERM: operation not permitted, unlink 'C:\Users\shawn\Desktop\BP_eClinic\EC.Inventory.API\ClientApp\node_modules\@angular\material\typings'] {
npm ERR!   cause: [Error: EPERM: operation not permitted, unlink 'C:\Users\shawn\Desktop\BP_eClinic\EC.Inventory.API\ClientApp\node_modules\@angular\material\typings'] {
npm ERR!     errno: -4048,
npm ERR!     code: 'EPERM',
npm ERR!     syscall: 'unlink',
npm ERR!     path: 'C:\\Users\\shawn\\Desktop\\BP_eClinic\\EC.Inventory.API\\ClientApp\\node_modules\\@angular\\material\\typings'
npm ERR!   },
npm ERR!   errno: -4048,
npm ERR!   code: 'EPERM',
npm ERR!   syscall: 'unlink',
npm ERR!   path: 'C:\\Users\\shawn\\Desktop\\BP_eClinic\\EC.Inventory.API\\ClientApp\\node_modules\\@angular\\material\\typings',
npm ERR!   parent: 'ClientApp'
npm ERR! }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It's possible that the file was already in use (by a text editor or antivirus),
npm ERR! or that you lack permissions to access it.
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator.

2 Answers 2

1

Try if this works:

npm install -S @angular/material @angular/cdk @angular/animations

npm uninstall @angular/core

npm install -S @angular/core

For updated post:

Try if this works:

  • Uninstall NodeJs

  • Delete folders 'npm' and 'npm-cache' from AppData/Roaming

  • Deactivate firewall and all antivirus (including Windows Defender)

  • Reboot system

  • Open command prompt as admin and execute 'npm install'

Or this:

 npm cache clean --force  

 npm install npm@latest -g
Sign up to request clarification or add additional context in comments.

4 Comments

Thank you for your advice. I had try the command but having error while installing. I had updated the error in the question.
It seem like my issue is same as this github.com/vmware/clarity/issues/5041. Anyone can explain what is the cause of the problem?
Same error after trying all the suggestions
Updated post with another thing, if it dosent work I don't know..
1

After a few days of troubleshooting, I had finally found out what is the issue. Angular Service Language Service is using the Ivy language service which is not compatible with Angular 8. All I need to do is just untick the enable Ivy language service and restart the visual studio code. After that, problem solve.

enter image description here

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.