Error Cannot find module '@angular/material
Solution 1
Here the changelog of material 2:
its says: Angular Material now requires Angular 4.4.3 or greater since 2.beta-11
If you want the last version of material you have to upgrade to angular 5+
If you want to stick to version 4.3.2 the last you can install is 2.0.0-beta10 ( i don't recommend that )
Solution 2
Look at the error and you will see that some packages need angular v.4.4.4. So I recommend you to update all @angular-packages to v.4.4.4.
Follow this steps:
1.) remove node_modules
2.) npm cache clean
3.) open packages.json and set the version by all @angular-packages to "^4.4.4"
4.) npm install
Related videos on Youtube
afeef
Updated on June 04, 2022Comments
-
afeef almost 2 years
Error
Cannot find module '@angular/material
app.module.ts
import { MaterialModule } from '@angular/material';
Link :https://material.angular.io/guide/getting-started
npm install --save @angular/material @angular/cdk
The solution that I tried
npm update
it doesn't works.
ng --version
@angular/cli: 1.2.1 node: 8.3.0 os: win32 x64 @angular/animation: 4.0.0-beta.8 @angular/animations: error @angular/cdk: error @angular/common: 4.3.2 @angular/compiler: 4.3.2 @angular/core: 4.3.2 @angular/forms: 4.3.2 @angular/http: 4.3.2 @angular/material: error @angular/platform-browser: 4.3.2 @angular/platform-browser-dynamic: 4.3.2 @angular/router: 4.3.2 @angular/cli: 1.2.1 @angular/compiler-cli: 4.4.3 @angular/language-service: 4.3.2
- can anyone suggest me after running npm command material module stop working.
I have made working demo https://github.com/afeef1915/Angular2-Symfony3-Demo
where all code was working fine.
- any suggestion is most welcome.
Error while Installing Material
D:\Angular2-Symfony3-Demo-master>npm install --save @angular/material @angular/cdk npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself. npm WARN @angular/[email protected] requires a peer of @angular/core@~4.4.4 but none is installed. You must install peer dependencies yourself. npm WARN @angular/[email protected] requires a peer of @angular/common@~4.4.4 but none is installed. You must install peer dependencies yourself. npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself. npm WARN @angular/[email protected] requires a peer of @angular/[email protected] but none is installed. You must install peer dependencies yourself. npm WARN @angular/[email protected] requires a peer of @angular/core@~4.4.4 but none is installed. You must install peer dependencies yourself. npm WARN @angular/[email protected] requires a peer of @angular/common@~4.4.4 but none is installed. You must install peer dependencies yourself. npm ERR! path D:\Angular2-Symfony3-Demo-master\node_modules\@angular\cdk npm ERR! code ENOENT npm ERR! errno -4058 npm ERR! syscall rename npm ERR! enoent ENOENT: no such file or directory, rename 'D:\Angular2-Symfony3-Demo-master\node_modules\@angular\cdk' -> 'D:\Angular2-Symfony3-Demo-master\node_modules\@angular\.cdk.DELETE' npm ERR! enoent This is related to npm not being able to find a file. npm ERR! enoent npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\mohd\AppData\Roaming\npm-cache\_logs\2018-02-01T13_42_49_724Z-debug.log
Package.json
{ "name": "angular2-bug-testing", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animation": "^4.0.0-beta.8", "@angular/animations": "^4.3.3", "@angular/cdk": "^2.0.0-beta.12", "@angular/common": "^4.0.0", "@angular/compiler": "^4.0.0", "@angular/core": "^4.3.6", "@angular/forms": "^4.0.0", "@angular/http": "^4.0.0", "@angular/material": "^2.0.0-beta.8", "@angular/platform-browser": "^4.0.0", "@angular/platform-browser-dynamic": "^4.0.0", "@angular/router": "^4.0.0", "angular-datatables": "^4.2.0", "angular-in-memory-web-api": "^0.3.2", "core-js": "^2.4.1", "datatables.net": "^1.10.15", "datatables.net-buttons-dt": "^1.3.1", "datatables.net-dt": "^1.10.15", "hammerjs": "^2.0.8", "jquery": "^3.2.1", "json-server": "^0.12.0", "rxjs": "^5.1.0", "zone.js": "^0.8.4" }, "devDependencies": { "@angular/cli": "1.2.1", "@angular/compiler-cli": "^4.4.3", "@angular/language-service": "^4.0.0", "@types/datatables.net": "^1.10.5", "@types/jasmine": "~2.5.53", "@types/jasminewd2": "~2.0.2", "@types/jquery": "^3.2.11", "@types/node": "~6.0.60", "codelyzer": "~3.0.1", "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.0.4", "tslint": "~5.3.2", "typescript": "~2.3.3" } }
-
afeef about 6 yearsi have updated with cmd>npm update -D && npm update -S