components: bug(Angular Material): Installing Angular Material 14 under Angular 14 after update from 12.x fails: Cannot read properties of undefined (reading 'kind')

Okay I just found a workaround:

1. run ng add @angular/material as usual
2. select theme
3. select typography
4. IMPORTANT: Choose to disable Angular animations module (“Do not include”) - the last option

Voilà

P.S.: I believe you can then manually configure the animations module by following these instructions: https://angular.io/guide/animations#step-1-enabling-the-animations-module

Thank @FatalMerlin, I’ve tried it, but it didn’t help. What did help is adding --skip-import, so, if anyone stumbles upon the same problem, I hope it helps.

However, those are still workarounds - I hope the Angular team figures it out soon.

I have the same issue: Cannot read properties of undefined (reading ‘kind’)

It happens when I try to use: ng generate @angular/material:navigation <component-name>

Project dependencies

“@angular/animations”: “^14.1.3”, “@angular/cdk”: “^14.1.2”, “@angular/common”: “^14.1.3”, “@angular/compiler”: “^14.1.3”, “@angular/core”: “^14.1.3”, “@angular/forms”: “^14.1.3”, “@angular/material”: “^14.1.2”, “@angular/platform-browser”: “^14.1.3”, “@angular/platform-browser-dynamic”: “^14.1.3”, “@angular/router”: “^14.1.3”, “rxjs”: “~7.5.0”, “tslib”: “^2.3.0”, “zone.js”: “~0.11.4”

I’m having a similar problem, using Angular 14.0.5:

Skipping installation: Package already installed
? Choose a prebuilt theme name, or "custom" for a custom theme: Custom
? Set up global Angular Material typography styles? Yes
? Include the Angular animations module? Include and enable animations
UPDATE package.json (1747 bytes)
✔ Packages installed successfully.
Cannot read property 'kind' of undefined

confirming npm i typescript@latest fixed this issue for me

Bon je viens de trouver une solution :

1. Cours `ng add @angular/material`comme d'habitude

2. sélectionne un thème

3. sélectionner la typographie

4. IMPORTANT : Choisissez de désactiver le module d'animations angulaires ("Ne pas inclure") - la dernière option

Voilà

PS : Je pense que vous pouvez ensuite configurer manuellement le module d’animations en suivant ces instructions : https://angular.io/guide/animations#step-1-enabling-the-animations-module

It worked for me, thanks

I had this issue and fixed it by updating to the latest TypeScript version. Currently 4.8.3. Hope this works for others.

Same here. Getting this error on installing angular material, and also on calling ng g @angular/material:navigation

Angular CLI: 14.1.0 Node: 16.15.1 Package Manager: npm 8.11.0 OS: win32 x64

Angular: 14.1.0 … animations, cdk, cli, common, compiler, compiler-cli, core … forms, material, platform-browser, platform-browser-dynamic … router

Package Version

@angular-devkit/architect 0.1401.0 @angular-devkit/build-angular 14.1.0 @angular-devkit/core 14.1.0 @angular-devkit/schematics 14.1.0 @schematics/angular 14.1.0 rxjs 7.5.6 typescript 4.6.4

Same with just a new project, no upgrades needed to reproduce.

Angular CLI: 14.1.0
Node: 16.16.0
Package Manager: yarn 1.22.10 
OS: darwin x64

Angular: 14.1.0
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1401.0
@angular-devkit/build-angular   14.1.0
@angular-devkit/core            14.1.0
@angular-devkit/schematics      14.1.0
@angular/fire                   7.4.1
@schematics/angular             14.1.0
rxjs                            6.6.7
typescript                      4.6.4