Angular 模块声明中的角度D3图表错误

我正在构建示例应用程序，其中我使用angular-d3-chart库在组件中显示图表。 我已经使用npm install angular-d3-charts--save安装了angular-d3-charts，但是当我在模块中声明d3图表组件时，它显示了错误：

错误： 无法在NgModule中声明“PieChartComponent”，因为它不是当前编译的一部分。 类BarChartComponent既不是角度组件，也不是指令或管道

以下是供参考的代码文件和屏幕截图

index.html

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>

有什么解决方案吗？

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { TodoRoutingModule } from './todo-routing.module';
import { ListingComponent } from './components/listing/listing.component';
import { AddComponent } from './components/add/add.component';
import { ReactiveFormsModule } from '@angular/forms';
import { GraphComponent } from './components/graph/graph.component';
import { SharedModule } from 'src/app/shared/shared.module';
import { NbCheckboxModule, NbIconModule, NbTabsetModule } from '@nebular/theme';
import { ChartsModule } from 'ng2-charts';
import { TrendComponent } from './components/trend/trend.component';
import { AlarmComponent } from './components/alarm/alarm.component';
import { DoughnutChartComponent, PieChartComponent, BarChartComponent } from 'angular-d3-charts'; // this is needed!

@NgModule({
  // tslint:disable-next-line:max-line-length
  declarations: [ListingComponent, AddComponent, GraphComponent, TrendComponent, AlarmComponent, DoughnutChartComponent, PieChartComponent, BarChartComponent ],
  imports: [
    CommonModule,
    ReactiveFormsModule,
    TodoRoutingModule,
    SharedModule,
    NbIconModule,
    ChartsModule,
    NbTabsetModule,
    NbCheckboxModule
  ],
  exports: [ListingComponent, AddComponent, AlarmComponent],
  providers: []
})
export class TodoModule { }