javascript - ng2-chart lib 没有导出成员,例如:ChartDataSetBase 等
问题描述
我正在尝试根据以下本教程实施财务图表:
https://valor-software.com/ng2-charts/
我还在这里找到了这个实现的一个例子: https ://stackblitz.com/edit/ng2-charts-financial-template?file=src%2Fchartjs-chart-financial%2Fchartjs-chart-financial.js
我在 VSC 中创建了一个新的 Angular 应用程序。我所做的与 stackblitz 中的示例完全相同。但是,当我运行ng serve时,出现以下错误:
ERROR in ./src/app/app-chart-config.ts 4:0-222
"export 'BaseChartMetaConfig' was not found in 'ng2-charts'
ERROR in ./src/app/app-chart-config.ts 4:0-222
"export 'ChartDataSetsBase' was not found in 'ng2-charts'
ERROR in ./src/app/app-chart-config.ts 4:0-222
"export 'ChartDataSetsUnion' was not found in 'ng2-charts'
ERROR in ./src/app/app-chart-config.ts 4:0-222
"export 'ChartMetaConfig' was not found in 'ng2-charts'
ERROR in ./src/app/app-chart-config.ts 4:0-222
"export 'LegacyMetaConfig' was not found in 'ng2-charts'
ERROR in ./src/app/app-chart-config.ts 4:0-222
"export 'PromiscuousMetaConfig' was not found in 'ng2-charts'
ERROR in ./src/app/app-chart-config.ts 4:0-222
"export 'ScaleUnion' was not found in 'ng2-charts'
ERROR in ./src/app/app.component.ts
Module not found: Error: Can't resolve 'chartjs-adapter-luxon' in 'E:\Chartjs\financial3\ng2-charts-financial-template\src\app'
问题似乎出在文件app-chart-config.ts上。
import * as ng2Charts from '../../node_modules/ng2-charts';
import { AppChartMetaConfig } from './app-chart-meta-config';
// Generated by ng2-charts-schematics. This file should not need any modification.
// To add new features to the chart.js module, edit the file 'app-chart-meta-config.ts`
export * from './app-chart-meta-config';
export {
ChartsModule,
Color,
Colors,
defaultColors,
ChartDataSetsBase,
ChartDataSetsUnion,
BaseChartMetaConfig,
ChartMetaConfig,
LegacyMetaConfig,
PromiscuousMetaConfig,
ScaleUnion,
ThemeService,
BaseChartDirective,
Label,
} from 'ng2-charts';
export type AngularChart = ng2Charts.AngularChart<AppChartMetaConfig>;
export type ChartOptions = ng2Charts.ChartOptions<AppChartMetaConfig> &
AppChartMetaConfig['additionalOptions'];
export type ChartDataSetsBar = ng2Charts.ChartDataSetsBar<AppChartMetaConfig>;
export type ChartDataSetsLine = ng2Charts.ChartDataSetsLine<AppChartMetaConfig>;
export type ChartDataSetsDoughnut = ng2Charts.ChartDataSetsDoughnut<
AppChartMetaConfig
>;
export type ChartDataSetsRadar = ng2Charts.ChartDataSetsRadar<
AppChartMetaConfig
>;
export type ChartDataSetsBubble = ng2Charts.ChartDataSetsBubble<
AppChartMetaConfig
>;
export type ChartDataSetsScatter = ng2Charts.ChartDataSetsScatter<
AppChartMetaConfig
>;
export type MultiDataSet = ng2Charts.MultiDataSet<AppChartMetaConfig>;
export type SingleDataSet = ng2Charts.SingleDataSet<AppChartMetaConfig>;
export type ChartType = ng2Charts.ChartType<AppChartMetaConfig>;
export type LinearScale = ng2Charts.LinearScale<AppChartMetaConfig>;
export type LogarithmicScale = ng2Charts.LogarithmicScale<AppChartMetaConfig>;
export type CategoryScale = ng2Charts.CategoryScale<AppChartMetaConfig>;
export type CartesianScale = ng2Charts.CartesianScale<AppChartMetaConfig>;
export type RadialScale = ng2Charts.RadialScale<AppChartMetaConfig>;
export type RadialLinearScale = ng2Charts.RadialLinearScale<AppChartMetaConfig>;
我的 app.module.ts:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { ChartsModule } from 'ng2-charts';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
@NgModule({
declarations: [AppComponent],
imports: [BrowserModule, AppRoutingModule, ChartsModule],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
我的 package.json
{
"name": "ng2-charts-financial-template",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "~10.1.2",
"@angular/common": "~10.1.2",
"@angular/compiler": "~10.1.2",
"@angular/core": "~10.1.2",
"@angular/forms": "~10.1.2",
"@angular/platform-browser": "~10.1.2",
"@angular/platform-browser-dynamic": "~10.1.2",
"@angular/router": "~10.1.2",
"chart.js": "^2.9.4",
"ng2-charts": "^2.4.2",
"rxjs": "~6.6.0",
"tslib": "^2.0.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.1001.2",
"@angular/cli": "~10.1.2",
"@angular/compiler-cli": "~10.1.2",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"@types/node": "^12.11.1",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.6.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": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"ng2-charts-schematics": "^0.1.7",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~4.0.2"
}
}
似乎它在 ng2 图表中缺少一些导出。有人知道如何解决这个问题吗?
提前致谢!
干杯,马塞洛
解决方案
推荐阅读
- unity3d - 设置照明后,场景中的物体继续变暗
- c++ - 您可以使用 setfill() 设置填充 2 位数字吗?
- git - Eslint 缓存跨分支持续存在?
- asp.net - 动态阻止 IP 地址到 Azure 云服务
- docker - 试图杀死所有 Docker 容器,但在强制删除后它们会重新启动
- sql - Oracle 11g:ORA-04098:触发器“SANCIONES_TRIG”无效并且重新验证失败
- maven - 你如何链接/缝合 Maven 插件?
- visual-studio-code - 如何将 Windows 上的 VSCode 键映射转移到 ubuntu
- c# - 为什么“缩放”的显示设置和使用超过 1 个显示器会导致我的 WPF 应用程序窗口在我的显示器上的不同区域进行动画处理?
- elasticsearch - Elasticsearch must_not 在嵌套查询中