tshad
tshad

Reputation: 365

Angular 12 error '"ng2-charts"' has no exported member named 'ChartsModule'

I get the above error when trying to add the ChartsModule to my app.module.ts file.

I added the charts to my project using the ng command all the articles say to use:

npm install ng2-charts chart.js --save

My app.module.ts file looks like the following.

enter image description here

Upvotes: 8

Views: 21528

Answers (2)

Developer
Developer

Reputation: 4331

Seems like charts library has had a new release and they replaced ChartsModule with BaseChartDirective.

Try to:

import { BaseChartDirective } from 'ng2-charts';

And use it as you would use BaseChartDirective ( of course there might be some other changes ).

Or you can downgrade and install not latest charts.js.

Here, even their GitHub ( https://github.com/valor-software/ng2-charts ) Says:

Import the BaseChartDirective in your app main module:

import { BaseChartDirective } from 'ng2-charts';

@Component({
  standalone: true,
  imports: [BaseChartDirective],
})
export class MyComponent {}

Upvotes: 11

sateesh
sateesh

Reputation: 92

So in your app.module.ts file while importing charts use this below import statement.

import {NgChartsModule} from 'ng2-charts';

After that in the same app.module.ts file in the imports section use as below :

imports : [
  BrowserModule,
  AppRoutingModule,
  NgChartsModule
  ]

 Now your NgChartsModule will work

Upvotes: -1

Related Questions