Has no exported member 'MdCardModule' and 'MdTooltipModule'

Question

When I run ng build It shows some errors:

ERROR in C:/761/search- bar/workload_management_app/Client/src/app/app.module.ts (8,9): Module '"C:/761/search- bar/workload_management_app/Client/node_modules/@angular/materia l/material"' has no exported member 'MdCardModule'.

ERROR in C:/761/search- bar/workload_management_app/Client/src/app/app.module.ts (8,23): Module '"C:/761/search- bar/workload_management_app/Client/node_modules/@angular/material/material"' has no exported member 'MdTooltipModule'.

ERROR in MdCardModule is not an NgModule

ERROR in C:/761/search- bar/workload_management_app/Client/src/app/app.module.ts (8,9): Module '"C:/761/search- bar/workload_management_app/Client/node_modules/@angular/material/materia l"' has no exported member 'MdCardModule'.

ERROR in C:/761/search- bar/workload_management_app/Client/src/app/app.module.ts (8,23): Module '"C:/761/search- bar/workload_management_app/Client/node_modules/@angular/material/materi al"' has no exported member 'MdTooltipModule'.

package.json

  "version": "0.0.0",
...
  "private": true,
  "dependencies": {
    "@angular/animations": "^4.2.4",
    "@angular/cdk": "^2.0.0-beta.11",
    "@angular/common": "^4.2.4",
    "@angular/compiler": "^4.2.4",
    "@angular/core": "^4.2.4",
    "@angular/forms": "^4.2.4",
    "@angular/http": "^4.2.4",
    "@angular/material": "github:angular/material2-builds",
    "@angular/platform-browser": "^4.2.4",
    "@angular/platform-browser-dynamic": "^4.2.4",
    "@angular/router": "^4.2.4",
    "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.2",
    "angular-numeric-directive": "^1.0.0",
    "angular2-busy": "^2.0.4",
    "bootstrap": "^4.0.0-beta",
    "core-js": "^2.4.1",
    "jquery": "^3.2.1",
    "ng2-drag-drop": "^2.6.0",
    "ng2-dragula": "^1.5.0",
    "ngx-bootstrap": "^1.9.3",
    "popper.js": "^1.12.5",
    "rxjs": "^5.4.2",
    "zone.js": "^0.8.14"

How can I solve this problem, could anyone help me?

PS: I tried to run npm install --save @angular/material before, but it didn't work.

Answer 1

The reason is because you are using MdCardModule but it should be MatCardModule since material 2.0.0-beta.11. Change the Md to Mat for all the imported modules. This is quite confusing since it was changed almost 3 weeks ago, but even the official get started documentation still uses the Md style which is no longer working.

From the beta.11 changelog:

For beta.11, we've made the decision to deprecate the "md" prefix completely and use "mat" moving forward. This affects all class names, properties, inputs, outputs, and selectors (CSS classes were changed back in February). The "md" prefixes will be removed in the next beta release.

Answer 2

The problem is with your angular version. Update your angular version to 4.4.3 or greater. Material 2.0.0-beta.11 depends on 4.4.3 or greater. From the [CHANGELOG][1] documentation:

Breaking changes Angular Material now requires Angular 4.4.3 or greater