Components: Unexpected directive 'MatTab' imported by the module 'AppModule'. Please add a @NgModule annotation

[realharry]

Bug, feature request, or proposal:

Bug.

What is the expected behavior?

Material components should be recognized.

What is the current behavior?

Throws error: "Unexpected directive MatXYZ...".

What are the steps to reproduce?

Providing a StackBlitz/Plunker (or similar) is the best way to get the team to see your issue.

Plunker starter (using on @master): https://goo.gl/uDmqyY

StackBlitz starter (using latest npm release): https://goo.gl/wwnhMV

(1) Create a new app using angular CLI.
(2) Add Angular Material dependencies following the Getting Started doc: https://material.angular.io/guide/getting-started
(3) Try "ng serve" and view the page error.

What is the use-case or motivation for changing an existing behavior?

N/A.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

tsc --version
Version 2.6.1

ng --version
Angular CLI: 1.5.0
Node: 6.11.5
OS: linux x64

"dependencies": {
"@angular/animations": "^5.0.0",
"@angular/cdk": "^5.0.0-rc0",
"@angular/common": "^5.0.0",
"@angular/compiler": "^5.0.0",
"@angular/core": "^5.0.0",
"@angular/forms": "^5.0.0",
"@angular/http": "^5.0.0",
"@angular/material": "^5.0.0-rc0",
"@angular/platform-browser": "^5.0.0",
"@angular/platform-browser-dynamic": "^5.0.0",
"@angular/router": "^5.0.0",
"core-js": "^2.4.1",
"hammerjs": "^2.0.8",
"rxjs": "^5.5.2",
"zone.js": "^0.8.14"
},

Is there anything else we should know?

None of the material components works, MatList, MatTab, MatCheckbox, ...

[willshowell]

You need to import MatTabModule, not MatTab.

[realharry]

@willshowell Thanks!! My first day of Angular-Material. :)

[RendyRex]

Hi,i have a similar problem but i'm using primeng,You know how i can go about that?

[tonydrake]

wow - what an issue!! - was an import case issue (file on disk was blockPage.ts (and should have been blockpage.ts (import { BlockPage } from './blockpage'; where not flagged as errors).

[ameeronline]

wow - what an issue!! - was an import case issue (file on disk was blockPage.ts (and should have been blockpage.ts (import { BlockPage } from './blockpage'; where not flagged as errors).

You should be using Windows. Windows don't respect case sensitivity in file names lol

[angular-automatic-lock-bot[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._}