15

I am encountering the error:

ERROR in ./node_modules/ng2-charts/fesm2015/ng2-charts.js

Module not found: Error: Can't resolve 'chart.js' in /node_modules/ng2-charts/fesm2015'

I did "npm install --save ng2-charts". Could you help me to understand why this error is thrown?

My package.json

"dependencies": {
"@angular/animations": "~8.2.9",
"@angular/common": "~8.2.9",
"@angular/compiler": "~8.2.9",
"@angular/core": "~8.2.9",
"@angular/fire": "^5.2.3",
"@angular/forms": "~8.2.9",
"@angular/platform-browser": "~8.2.9",
"@angular/platform-browser-dynamic": "~8.2.9",
"@angular/router": "~8.2.9",
"@ngrx/store": "^8.6.0",
"@ngrx/store-devtools": "^8.6.0",
"bootstrap": "^4.4.1",
"firebase": "^7.6.0",
"ng2-charts": "^2.2.3",
"rxjs": "~6.4.0",
"sweetalert2": "^9.5.3",
"tslib": "^1.10.0",
"zone.js": "~0.9.1" }

"devDependencies": {
"@angular-devkit/build-angular": "^0.803.21",
"@angular/cli": "~8.3.8",
"@angular/compiler-cli": "~8.2.9",
"@angular/language-service": "~8.2.9",
"@types/jasmine": "~3.3.8",
"@types/jasminewd2": "~2.0.3",
"@types/node": "~8.9.4",
"codelyzer": "^5.0.0",
"jasmine-core": "~3.4.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.1.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.0",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
"typescript": "~3.5.3" }

Error in broswer

enter image description here

Andres
  • 731
  • 2
  • 10
  • 22
  • when exactly does this error happen?? – Andre Figueiredo Jan 08 '20 at 01:48
  • Does this answer your question? [WARNING in ./node\_modules/ng2-charts/fesm5/ng2-charts.js 230:54-72 "export 'ɵɵdefineInjectable' was not found in '@angular/core'](https://stackoverflow.com/questions/56371427/warning-in-node-modules-ng2-charts-fesm5-ng2-charts-js-23054-72-export-%c9%b5%c9%b5de) – Andre Figueiredo Jan 08 '20 at 01:50
  • 5
    Solved, For Angular 7 or greater version use ```npm install ng2-charts@2.2.3 --save``` AND ```npm install chart.js --save``` – Andres Jan 08 '20 at 02:01

3 Answers3

33

ng2-charts is just an angular wrapper for Chart.js library. Hence the latter also needs to be installed separately.

npm install --save ng2-charts

npm install --save chart.js

Community
  • 1
  • 1
MonkeyScript
  • 4,776
  • 1
  • 11
  • 28
0

Try installing chartjs higher version, For me an older version was installed Try "npm install chartjs@3.7.1"

Nithin Samuel
  • 1
  • 3
0

The following needs to be added to angular.json:

"scripts": [
    "node_modules/chart.js/dist/Chart.js"
],

Note that Chart.js starts with a capital letter. chart.js might work on some platforms but not on all platforms.

tschumann
  • 2,776
  • 3
  • 26
  • 42