Has no exported member 'MdCardModule' and 'MdTooltipModule'

user_8730482 0
Viewed 5023

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.

angular-cli npm angular npm-install frontend
4 Answers

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.

user_10545890

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

user_17919130

You have to import each material component you want to use If you are using angular cli then you can import them globally in app.module.ts something like

import { MdCardModule, MdTooltipModule} from '@angular/material';

  imports: [MdCardModule, MdTooltipModule]
user_56218270

From the angular material changelog:

Deprecation of "md" prefix.

In earlier betas, we've had a compatibility mode that allowed people to use either "md" or "mat" as the selector for Angular Material components. This was created so that these components could live side-by-side with AngularJS Material without CSS from the two libraries colliding.

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.

You can automatically update your projects with the angular-material-prefix-updater tool. Check out the tool's page for instructions on how to run.

The good news is there is a migration tool from beta 11 to beta 12:

Tried it and it works fine.

user_6454280
Related