CODEWITHSUNDEEP
angularangular-materialangular-cli-v6
Jeremy Scott Peters
Jeremy Scott Peters

Reputation: 387

AngularCLI and Angular Material (schematics) error: Collection "@angular/material" cannot be resolved

I am trying to use the Angular schemats that are shown on this page. When I try to use this following command in the terminal at the root of the project ng generate @angular/material:material-nav --name name-of-new-nav, I get the following error in red,

Collection "@angular/material" cannot be resolved. Error: Collection "@angular/material" cannot be resolved. at NodeModulesEngineHost._resolveCollectionPath (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular-devkit/schematics/tools/node-module-engine-host.js:88:15) at NodeModulesEngineHost.createCollectionDescription (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular-devkit/schematics/tools/file-system-engine-host-base.js:106:27) at SchematicEngine._createCollectionDescription (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular-devkit/schematics/src/engine/engine.js:78:40) at SchematicEngine.createCollection (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular-devkit/schematics/src/engine/engine.js:71:43) at Object.getCollection (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/utilities/schematics.js:28:31) at GenerateCommand.getOptions (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/models/schematic-command.js:193:41) at GenerateCommand. (/Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:38:53) at Generator.next () at /Users/jeremypeters/MEGA/development/learning/angular/material-learn/node_modules/@angular/cli/commands/generate.js:7:71 at new Promise ()

How do I get this to work?

Info: Angular CLI: 6.0.8

Upvotes: 20

Views: 13205

Answers (6)

nasar siddiqui
nasar siddiqui

Reputation: 1

I found you're syntax wrong : ng generate @angular/material:nav <name-of-new-nav>.

Upvotes: 0

AbdulRehman
AbdulRehman

Reputation: 1026

The Error is due to Angular Material 7. just run the following command in your terminal ng add @angular/[email protected]

Upvotes: 0

Archil Labadze
Archil Labadze

Reputation: 4325

Worked for me this way (from docs)

ng add @angular/material

ng generate @angular/material:material-nav --name <component-name>

ng generate @angular/material:material-dashboard --name <component-name>

ng generate @angular/material:material-table --name <component-name>

Angular 6.4.7

Upvotes: 1

Aleksey K.
Aleksey K.

Reputation: 121

You can install it using:
ng generate @angular/material:dashboard --name myDashboard

For other components it will be:
ng generate @angular/material:nav --name myNav
ng generate @angular/material:table --name myTable

Info about other component schematics you can find in file, located in:
/node_modules/@angular/material/schematics/collection.json

Upvotes: 8

Abdelkader EL YAZIDI
Abdelkader EL YAZIDI

Reputation: 31

Try the following cmds, It worked for me : 

npm install --save @angular/[email protected] @angular/[email protected]

ng add @angular/[email protected]

Upvotes: 3

Indrakumara
Indrakumara

Reputation: 1645

It seems broken, Temp solution, use the following version 

ng add @angular/[email protected]

Upvotes: 41

Related Questions