Hola desarrolladores, he estado literalmente todo el día tratando de implementar gráficos en mi proyecto, pero siguiendo los documentos oficiales no hay forma de que pueda eliminar este error:
ERROR in ./node_modules/ng2-charts/__ivy_ngcc__/fesm2015/ng2-charts.js 317:8-21 "export 'pluginService' was not found in 'chart.js' node_modules/ng2-charts/lib/base-chart.directive.d.ts:4:59 - error TS2305: Module '"../../chart.js/types/index.esm"' has no exported member 'ChartPoint'. 4 import { ChartConfiguration, ChartDataSets, ChartOptions, ChartPoint, ChartType, PluginServiceGlobalRegistration, PluginServiceRegistrationOptions } from 'chart.js'; ~~~~~~~~~~ node_modules/ng2-charts/lib/base-chart.directive.d.ts:4:82 - error TS2305: Module '"../../chart.js/types/index.esm"' has no exported member 'PluginServiceGlobalRegistration'. 4 import { ChartConfiguration, ChartDataSets, ChartOptions, ChartPoint, ChartType, PluginServiceGlobalRegistration, PluginServiceRegistrationOptions } from 'chart.js'; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ node_modules/ng2-charts/lib/base-chart.directive.d.ts:4:115 - error TS2305: Module '"../../chart.js/types/index.esm"' has no exported member 'PluginServiceRegistrationOptions'. 4 import { ChartConfiguration, ChartDataSets, ChartOptions, ChartPoint, ChartType, PluginServiceGlobalRegistration, PluginServiceRegistrationOptions } from 'chart.js'; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ node_modules/ng2-charts/lib/base-chart.directive.d.ts:32:12 - error TS2304: Cannot find name 'Chart'. 32 chart: Chart; ~~~~~ node_modules/ng2-charts/lib/base-chart.directive.d.ts:56:35 - error TS2304: Cannot find name 'Chart'. 56 getChartBuilder(ctx: string): Chart; ~~~~~ src/app/components/graphics/graphics.component.ts:6:20 - error TS2305: Module '"../../../../node_modules/chart.js/types/index.esm"' has no exported member 'pluginService'. 6 import { ChartType,pluginService} from 'chart.js'; ~~~~~~~~~~~~~ Date: 2021-04-03T22:59:36.844Z - Hash: 2c8378fd3f46cd7e10f8 6 unchanged chunks Time: 2109ms ERROR in ./node_modules/ng2-charts/__ivy_ngcc__/fesm2015/ng2-charts.js 317:8-21 "export 'pluginService' was not found in 'chart.js' ERROR in ./node_modules/ng2-charts/__ivy_ngcc__/fesm2015/ng2-charts.js 324:8-21 "export 'pluginService' was not found in 'chart.js' ERROR in node_modules/ng2-charts/lib/base-chart.directive.d.ts:4:30 - error TS2724: Module '"../../chart.js/types/index.esm"' has no exported member 'ChartDataSets'. Did you mean 'ChartDataset'? 4 import { ChartConfiguration, ChartDataSets, ChartOptions, ChartPoint, ChartType, PluginServiceGlobalRegistration, PluginServiceRegistrationOptions } from 'chart.js'; ~~~~~~~~~~~~~ node_modules/ng2-charts/lib/base-chart.directive.d.ts:4:59 - error TS2305: Module '"../../chart.js/types/index.esm"' has no exported member 'ChartPoint'. 4 import { ChartConfiguration, ChartDataSets, ChartOptions, ChartPoint, ChartType, PluginServiceGlobalRegistration, PluginServiceRegistrationOptions } from 'chart.js'; ~~~~~~~~~~ node_modules/ng2-charts/lib/base-chart.directive.d.ts:4:82 - error TS2305: Module '"../../chart.js/types/index.esm"' has no exported member 'PluginServiceGlobalRegistration'. 4 import { ChartConfiguration, ChartDataSets, ChartOptions, ChartPoint, ChartType, PluginServiceGlobalRegistration, PluginServiceRegistrationOptions } from 'chart.js'; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ node_modules/ng2-charts/lib/base-chart.directive.d.ts:4:115 - error TS2305: Module '"../../chart.js/types/index.esm"' has no exported member 'PluginServiceRegistrationOptions'. 4 import { ChartConfiguration, ChartDataSets, ChartOptions, ChartPoint, ChartType, PluginServiceGlobalRegistration, PluginServiceRegistrationOptions } from 'chart.js'; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ node_modules/ng2-charts/lib/base-chart.directive.d.ts:32:12 - error TS2304: Cannot find name 'Chart'. 32 chart: Chart; ~~~~~ node_modules/ng2-charts/lib/base-chart.directive.d.ts:56:35 - error TS2304: Cannot find name 'Chart'. 56 getChartBuilder(ctx: string): Chart; ~~~~~Todo esto cuando estoy tratando de implementar ng2-charts envolviendo chart.js desde su sitio oficial a través de los comandos:
npm install --save ng2-charts npm install --save chart.jsMi paquete.json tiene esta estructura:
{ "name": "front", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "postinstall": "ngcc" }, "private": true, "dependencies": { "@angular/animations": "~10.0.5", "@angular/cdk": "^10.2.7", "@angular/common": "~10.0.5", "@angular/compiler": "~10.0.5", "@angular/core": "~10.0.5", "@angular/forms": "~10.0.5", "@angular/material": "^10.2.7", "@angular/platform-browser": "~10.0.5", "@angular/platform-browser-dynamic": "~10.0.5", "@angular/router": "~10.0.5", "@mapbox/mapbox-gl-geocoder": "^4.7.0", "@ngrx/effects": "^10.1.2", "@ngrx/store": "^10.1.2", "@ngrx/store-devtools": "^10.1.2", "@swimlane/ngx-charts": "^17.0.1", "@swimlane/ngx-datatable": "^19.0.0", "angular-datatables": "^11.1.1", "bootstrap": "^4.6.0", "chart.js": "^3.0.1", "chartjs-plugin-datalabels": "^0.7.0", "datatables.net": "^1.10.20", "datatables.net-dt": "^1.10.20", "jquery": "^3.6.0", "mapbox-gl": "^2.2.0", "ng2-charts": "^2.4.2", "popper.js": "^1.16.1", "rxjs": "~6.5.5", "tslib": "^2.0.0", "uuid": "^8.3.2", "zone.js": "~0.10.3" }, "devDependencies": { "@angular-devkit/build-angular": "~0.1000.4", "@angular/cli": "~10.0.4", "@angular/compiler-cli": "~10.0.5", "@types/datatables.net": "^1.10.18", "@types/jasmine": "~3.5.0", "@types/jasminewd2": "~2.0.3", "@types/jquery": "^3.3.33", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "jasmine-core": "~3.5.0", "jasmine-spec-reporter": "~5.0.0", "karma": "~5.0.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage-istanbul-reporter": "~3.0.2", "karma-jasmine": "~3.3.0", "karma-jasmine-html-reporter": "^1.5.0", "protractor": "~7.0.0", "ts-node": "~8.3.0", "tslint": "~6.1.0", "typescript": "~3.9.5" } }Y ChartModule se implementa en app.module, así como en el componente modularizado en el que podría estar configurando los gráficos.
No estoy seguro de por qué esta situación. Cualquier ayuda sería increíble. Gracias por adelantado
cambiar la versión
"chart.js": "^2.9.4", "ng2-charts": "^2.4.2"
en paquete.json y
npm yo
construir
Trabajar como un encanto..
El mismo problema para ng2-charts y chart.js en blanco y negro incompatibles.
Reparado:
"chart.js": "^2.9.4",
"ng2-gráficos": "^2.4.2"
Angular CLI: 9.0.3 Node: 16.10.0 OS: linux x64 Angular: ... Ivy Workspace: Package Version ------------------------------------------------------ @angular-devkit/architect 0.900.3 @angular-devkit/core 9.0.3 @angular-devkit/schematics 9.0.3 @schematics/angular 9.0.3 @schematics/update 0.900.3 rxjs 6.5.3Tienes que actualizar ng2-charts
npm install ng2-charts@v3.0.0-rc.3Tuve el mismo problema y lo resolví cambiando las versiones:
npm instalar ng2-charts@2.2.3 chart.js@2.9.3 --guardar
para angular 12.2.2 a continuación, la versión de dependencias funcionó para mí
"ng2-charts": "^2.4.2",` "chart.js": "^2.9.3",`Yo también tengo el problema similar. No estoy seguro de la solución. Lo resolví degradando los paquetes de gráficos a "ng2-charts": "^2.3.0" y "chart.js": "^2.9.3".
La razón por la que los gráficos no funcionan en angular tal vez se deba a la compatibilidad de la versión, estoy trabajando con angular 11.2.0 , npm 6.14.11 y node v15.13.0 . Estaba enfrentando el problema mencionado a continuación con los gráficos.
Error: node_modules/ng2-charts/lib/base-chart.directive.d.ts:17:23 - error TS2724: '"D:/myAngularWorks/testproject/node_modules/chart.js/types/index.esm"' has no exported member named 'ChartDataSets'. Did you mean 'ChartDataset'? 17 datasets: chartJs.ChartDataSets[]; ~~~~~~~~~~~~~ Error: node_modules/ng2-charts/lib/base-chart.directive.d.ts:33:12 - error TS2304: Cannot find name 'Chart'. 33 chart: Chart; ~~~~~ Error: node_modules/ng2-charts/lib/base-chart.directive.d.ts:57:35 - error TS2304: Cannot find name 'Chart'. 57 getChartBuilder(ctx: string): Chart; ~~~~~ Error: node_modules/ng2-charts/lib/base-chart.directive.d.ts:6:57 - error TS2694: Namespace '"D:/myAngularWorks/testproject/node_modules/chart.js/types/index.esm"' has no exported member 'ChartPoint'. 6 export declare type SingleDataSet = (number[] | chartJs.ChartPoint[]); ~~~~~~~~~~ Error: node_modules/ng2-charts/lib/base-chart.directive.d.ts:7:56 - error TS2694: Namespace '"D:/myAngularWorks/testproject/node_modules/chart.js/types/index.esm"' has no exported member 'ChartPoint'. 7 export declare type MultiDataSet = (number[] | chartJs.ChartPoint[])[]; ~~~~~~~~~~ Error: node_modules/ng2-charts/lib/base-chart.directive.d.ts:9:115 - error TS2694: Namespace '"D:/myAngularWorks/testproject/node_modules/chart.js/types/index.esm"' has no exported member 'PluginServiceRegistrationOptions'. 9 export declare type PluginServiceGlobalRegistrationAndOptions = chartJs.PluginServiceGlobalRegistration & chartJs.PluginServiceRegistrationOptions; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Error: node_modules/ng2-charts/lib/base-chart.directive.d.ts:9:73 - error TS2694: Namespace '"D:/myAngularWorks/testproject/node_modules/chart.js/types/index.esm"' has no exported member 'PluginServiceGlobalRegistration'. 9 export declare type PluginServiceGlobalRegistrationAndOptions = chartJs.PluginServiceGlobalRegistration & chartJs.PluginServiceRegistrationOptions;este problema se puede resolver instalando la versión compatible de chart.js y ng2-charts usando el siguiente comando:
npm install chart.js@2.9.3 --save npm install ng2-charts@2.2.3 --saveen su proyecto, ejecute npm i y reinicie el proyecto.