Issue in exporting the Angular material modules after migrating to 5.2.2

Question

I am getting the following error after migrating to Angular material 5.2.2. Prior to that my application was in Angular material 2.0.0-beta.10.

After changing the version in the package.json and running the npm install, I also followed the steps mentioned in the post https://stackoverflow.com/a/47726311/6167659

I notice that all the Md* tags are changed to Mat*, but now I am facing the error as

ERROR in .../src/app/pages/messagebox/messagebox-component.ts (2,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MAT_DIALOG_DATA'.
ERROR in .../src/app/pages/messagebox/messagebox-component.ts (2,27): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/bisstatus/bisjobstatistics.component.ts (12,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/bisstatus/bisjobstatistics.component.ts (21,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/bisstatus/bisjoblog.component.ts (12,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/bisstatus/bisjoblog.component.ts (21,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/bisstatus/bisjobcontrol.component.ts (12,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/sidemenu/sidemenu.module.ts (7,9): Module '".../node_modules/@angular/material/material"' has no exported member 'MatButtonModule'.
ERROR in .../src/app/pages/applications/deleteApplicationDialog.component.ts (4,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/applications/deleteApplicationDialog.component.ts (6,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/pages/applications/createApplicationDialog.component.ts (4,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/applications/createApplicationDialog.component.ts (5,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/pages/share/share-dialog.component.ts (4,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/share/share-dialog.component.ts (5,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/pages/applications/applicationList.component.ts (6,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/reports/select-report-dialog.component.ts (5,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/reports/editReportDialog.component.ts (4,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/reports/editReportDialog.component.ts (6,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/pages/reports/report.component.ts (5,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/reports/report.component.ts (6,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/pages/dashboard-page/select-dashboard-dialog.component.ts (5,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/dashboard-page/dashboard-app.component.ts (5,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/appsettings/appSettingsDialog.component.ts (3,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/home/homePage.component.ts (6,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/home/homePage.component.ts (7,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/pages/dashboard-page/editDashboardDialog.component.ts (4,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/dashboard-page/editDashboardDialog.component.ts (6,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/pages/dashboard-page/dashboard.component.ts (5,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/dashboard-page/dashboard.component.ts (5,21): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogConfig'.
ERROR in .../src/app/pages/dashboard-page/dashboard.component.ts (6,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/utils/error-handler.ts (6,29): Cannot find module 'stacktrace-js'.
ERROR in .../src/app/app.module.ts (58,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatAutocompleteModule'.
ERROR in .../src/app/app.module.ts (59,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatButtonModule'.
ERROR in .../src/app/app.module.ts (60,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatButtonToggleModule'.
ERROR in .../src/app/app.module.ts (61,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatCardModule'.
 
ERROR in .../src/app/app.module.ts (65,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatGridListModule'.
ERROR in .../src/app/app.module.ts (66,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatIconModule'.
ERROR in .../src/app/app.module.ts (67,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatInputModule'.
ERROR in .../src/app/app.module.ts (68,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatListModule'.
ERROR in .../src/app/app.module.ts (69,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatMenuModule'.
ERROR in .../src/app/app.module.ts (70,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatProgressBarModule'.
ERROR in .../src/app/app.module.ts (71,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatProgressSpinnerModule'.
ERROR in .../src/app/app.module.ts (72,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatRadioModule'.
ERROR in .../src/app/app.module.ts (73,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatRippleModule'.
ERROR in .../src/app/app.module.ts (74,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSelectModule'.
ERROR in .../src/app/app.module.ts (75,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSidenavModule'.
ERROR in .../src/app/app.module.ts (76,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSliderModule'.
ERROR in .../src/app/app.module.ts (77,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSlideToggleModule'.
ERROR in .../src/app/app.module.ts (78,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBarModule'.
ERROR in .../src/app/app.module.ts (79,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatTabsModule'.
ERROR in .../src/app/app.module.ts (80,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatToolbarModule'.
ERROR in .../src/app/app.module.ts (81,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatTooltipModule'.
ERROR in Error: Metadata version mismatch for module .../node_modules/ngx-perfect-scrollbar/dist/ngx-perfect-scrollbar.d.ts, found version 4, expected 3, resolving symbol AppModule in .../src/app/app.module.ts, resolving symbol AppModule in .../src/app/app.module.ts
    at Error (native)
    at syntaxError (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@angular\compiler\bundles\compiler.umd.js:1729:34)
    at simplifyInContext (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@angular\compiler\bundles\compiler.umd.js:25111:23)
    at StaticReflector.simplify (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@angular\compiler\bundles\compiler.umd.js:25123:13)
    at StaticReflector.annotations (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@angular\compiler\bundles\compiler.umd.js:24553:41)
    at _getNgModuleMetadata (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@angular\compiler-cli\src\ngtools_impl.js:138:31)
    at _extractLazyRoutesFromStaticModule (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@angular\compiler-cli\src\ngtools_impl.js:109:26)
    at Object.listLazyRoutesOfModule (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@angular\compiler-cli\src\ngtools_impl.js:53:22)
    at Function.NgTools_InternalApi_NG_2.listLazyRoutes (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@angular\compiler-cli\src\ngtools_api.js:91:39)
    at AotPlugin._getLazyRoutesFromNgtools (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@ngtools\webpack\src\plugin.js:240:66)
    at _donePromise.Promise.resolve.then.then.then.then.then (C:\Krishnan\RSI\SourceCode\Bluesky Developement\BlueSky Development\Firebolt.Web\node_modules\@ngtools\webpack\src\plugin.js:493:24)
    at process._tickCallback (internal/process/next_tick.js:109:7)
ERROR in .../src/app/Services/ClientAPIService.ts (9,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/app.module.ts (59,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatButtonModule'.
ERROR in .../src/app/app.module.ts (60,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatButtonToggleModule'.
ERROR in .../src/app/app.module.ts (61,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatCardModule'.
ERROR in .../src/app/app.module.ts (62,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatCheckboxModule'.
ERROR in .../src/app/app.module.ts (63,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatChipsModule'.
ERROR in .../src/app/app.module.ts (64,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogModule'.
ERROR in .../src/app/app.module.ts (65,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatGridListModule'.
ERROR in .../src/app/app.module.ts (66,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatIconModule'.
ERROR in .../src/app/app.module.ts (67,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatInputModule'.
ERROR in .../src/app/app.module.ts (68,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatListModule'.
ERROR in .../src/app/app.module.ts (69,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatMenuModule'.
ERROR in .../src/app/app.module.ts (70,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatProgressBarModule'.
ERROR in .../src/app/app.module.ts (71,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatProgressSpinnerModule'.
ERROR in .../src/app/app.module.ts (72,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatRadioModule'.
ERROR in .../src/app/app.module.ts (73,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatRippleModule'.
ERROR in .../src/app/app.module.ts (74,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSelectModule'.
ERROR in .../src/app/app.module.ts (75,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSidenavModule'.
ERROR in .../src/app/app.module.ts (76,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSliderModule'.
ERROR in .../src/app/app.module.ts (77,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSlideToggleModule'.
ERROR in .../src/app/app.module.ts (78,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBarModule'.
ERROR in .../src/app/app.module.ts (79,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatTabsModule'.
ERROR in .../src/app/app.module.ts (80,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatToolbarModule'.
ERROR in .../src/app/app.module.ts (81,3): Module '".../node_modules/@angular/material/material"' has no exported member 'MatTooltipModule'.
ERROR in .../src/app/app.component.ts (2,9): Module '".../node_modules/@angular/material/material"' has no exported member 'MatIconRegistry'.
ERROR in .../src/app/sidemenu/sidemenu.module.ts (7,9): Module '".../node_modules/@angular/material/material"' has no exported member 'MatButtonModule'.
ERROR in .../src/app/Services/ClientAPIService.ts (9,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatSnackBar'.
ERROR in .../src/app/utils/error-handler.ts (6,29): Cannot find module 'stacktrace-js'.
ERROR in .../src/app/pages/bisstatus/bisstatussummary.component.ts (5,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/bisstatus/bisjobcontrol.component.ts (12,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/bisstatus/bisjobstatistics.component.ts (12,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/bisstatus/bisjobstatistics.component.ts (21,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.
ERROR in .../src/app/pages/bisstatus/bisjoblog.component.ts (12,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialog'.
ERROR in .../src/app/pages/bisstatus/bisjoblog.component.ts (21,10): Module '".../node_modules/@angular/material/material"' has no exported member 'MatDialogRef'.    

I tried deleting the entire node_modules folder and rerun the npm install, but still the same issue exists. None of the below imported modules couldn't be exported

import {
  MatAutocompleteModule,
  MatButtonModule,
  MatButtonToggleModule,
  ...
  MatTabsModule,
  MatToolbarModule,
  MatTooltipModule,
} from '@angular/material';

What is the mistake I am doing here, why the latest material modules could be referenced/exported?

Answer 1

Remove package-lock.json, node modules and run npm install again.