Angular Material is not working at all in Angular

[arpan2501]

Please find the below error i am getting.
I have followed the instructions mentioned on the Angular Material site.
Why it is looking in @angular/material/material - i have no idea.
From yesterday i am getting this error -

/Users/arpan/Documents/Angular/testApp/src/app/app.module.ts (6,9): Module '"/Users/arpan/Documents/Angular/testApp/node_modules/@angular/material/material"' has no exported member 'MdButtonModule'.

[ChrisHuston]

The 'Md' prefix was changed to 'Mat' in beta 12. Try changing to 'MatButtonModule'.

Have a look at the Material release notes for more info:

https://github.com/angular/material2/blob/master/CHANGELOG.md

[danwulff]

@arpan2501 There's also a tool to automatically update the material prefixes available here: https://www.npmjs.com/package/angular-material-prefix-updater

Also, to add to @ChrisHuston's reply. I'd recommend setting your package.json version of @angular/material and @angular/cdk to a specific version until a stable release is issued.

So in your package.json use: "@angular/cdk": "2.0.0-beta.11" and "@angular/material": "2.0.0-beta.11" instead of "^2.0.0-beta.11". That way you can increment the version manually when you're ready to. (The Angular Material project will likely continue to have breaking changes during each version update until a stable release is distributed).

I'd still recommend trying to keep up with the latest material release as lots of bugs and features come out with each version. I've just found it easiest to read the release notes for breaking changes before incrementing (rather than letting npm install the latest available): https://github.com/angular/material2/releases

[filipesilva]

I'm closing it as answered by @ChrisHuston and @danwulff, thanks!

[arpan2501]

Thanks Brothers for helping it - 'MatButtonModule' in beta 12 (Perfect!!)
I don't want to drag this thread but there seems to be new issue when i am running the app
**
Unexpected module 'MatButtonModule' declared by the module 'AppModule'. Please add a @Pipe/@Directive/@component annotation.
**
**Versions installed ** -
@angular/cli: 1.4.9
node: 6.11.5
os: darwin x64
npm --version is 3.10.10.

"@angular/animations": "^4.4.6",
"@angular/cdk": "^2.0.0-beta.12",
"@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": "^2.0.0-beta.12",
"@angular/platform-browser": "^4.2.4",
"@angular/platform-browser-dynamic": "^4.2.4",
"@angular/router": "^4.2.4",
"core-js": "^2.4.1",
"rxjs": "^5.4.2",
"zone.js": "^0.8.14"
},
"devDependencies": {
"@angular/cli": "1.4.9",
"@angular/compiler-cli": "^4.2.4",
"@angular/language-service": "^4.2.4",
"@types/jasmine": "~2.5.53",
"@types/jasminewd2": "~2.0.2",
"@types/node": "~6.0.60",
"codelyzer": "~3.2.0",
"jasmine-core": "~2.6.2",
"jasmine-spec-reporter": "~4.1.0",
"karma": "~1.7.0",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.2",
"ts-node": "~3.2.0",
"tslint": "~5.7.0",
"typescript": "~2.3.3"

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}