Cannot find module '@angular/cdk/dialog' - Angular upgrade v13 to v14 issue

Question

I upgraded Angular from v13 to v14

ng update @angular/core@14 @angular/cli@14

ng update @angular/material@14

Getting this error after upgrade:

./node_modules/@angular/material/fesm2015/dialog.mjs:1:0-93 - Error: Module not found: Error: Package path ./dialog is not exported from package D:\projectName\node_modules\@angular\cdk (see exports field in D:\projectName\node_modules\@angular\cdk\package.json)

Error: node_modules/@angular/material/dialog/index.d.ts:3:36 - error TS2307: Cannot find module '@angular/cdk/dialog' or its corresponding type declarations.

3 import { CdkDialogContainer } from '@angular/cdk/dialog';

This is my package.json :

"dependencies": {
    "@angular/animations": "^14.0.1",
    "@angular/cdk": "^14.0.1",
    "@angular/common": "^14.0.1",
    "@angular/compiler": "^14.0.1",
    "@angular/core": "^14.0.1",
    "@angular/forms": "^14.0.1",
    "@angular/material": "^14.0.1",
    "@angular/platform-browser": "^14.0.1",
    "@angular/platform-browser-dynamic": "^14.0.1",

I'm not sure what I'm doing wrong, will appreciate any help.

Answer 1

1.Make sure you have already installed angular/cdk. If you don't have already installed, run the following command.

npm i @angular/cdk

2.Make sure you have already import that CdkDialogContainer. If you don't already imported, import the following code where your material module imported.

import { CdkDialogContainer } from '@angular/cdk/dialog';

Answer 2

I think you need to reinstall your node_modules, try these commands:

rm -rf node_modules

rm -f package-lock.json

npm cache clean --force

npm install --force