Ionic Angular Chartjs错误TS2304：无法找到名称

icomxhvb 于 2023-09-28 发布在 Ionic

关注(0)|答案(2)|浏览(207)

我在Angular和Ionic中使用chartjs：
已安装：

npm install chart.js --保存

HTML

<!-- Graph -->
<div class="chart">
  <canvas #myChart></canvas>
</div>

import { Chart, registerables } from 'chart.js';

Chart.register(...registerables);

const ctx = this.myChart.nativeElement;
this.chartHolder = new Chart(ctx, {
  type: 'doughnut',
  data,
  options
});

终端错误

ERROR in ../ node_modules / chart.js / types / index.esm.d.ts: 522: 5 - error TS2304: Cannot find name 'OffscreenCanvasRenderingContext2D'.
522 | OffscreenCanvasRenderingContext2D

        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ./ node_modules / chart.js / types / index.esm.d.ts: 524: 5 - error TS2304: Cannot find name 'OffscreenCanvas'.
524 | OffscreenCanvas
        ~~~~~~~~~~~~~~~
  ./ node_modules / chart.js / types / index.esm.d.ts: 525: 35 - error TS2304: Cannot find name 'OffscreenCanvas'.
525 | { canvas: HTMLCanvasElement | OffscreenCanvas }
                                      ~~~~~~~~~~~~~~~
  ./ node_modules / chart.js / types / index.esm.d.ts: 526: 62 - error TS2304: Cannot find name 'OffscreenCanvas'.
526 | ArrayLike<CanvasRenderingContext2D | HTMLCanvasElement | OffscreenCanvas>;
                                                                 ~~~~~~~~~~~~~~~
  ./ node_modules / chart.js / types / index.esm.d.ts: 3351: 66 - error TS2315: Type 'DeepPartial' is not generic.
3351 export type ScaleOptions<TScale extends ScaleType = ScaleType> = DeepPartial<ScaleOptionsByType<TScale>>;
                                                                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ./ node_modules / chart.js / types / index.esm.d.ts: 3365: 65 - error TS2315: Type 'DeepPartial' is not generic.
3365 export type ChartOptions<TType extends ChartType = ChartType> = DeepPartial<
                                                                         ~~~~~~~~~~~~
      3366   CoreChartOptions<TType> &
             ~~~~~~~~~~~~~~~~~~~~~~~~~~~
         ...
      3371   ChartTypeRegistry[TType]['chartOptions']
           ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
      3372 >;

ionic-framework

来源：https://stackoverflow.com/questions/68209426/angular-chartjs-error-ts2304-cannot-find-name-offscreencanvasrenderingcontext2d

2条答案

按热度按时间

j1dl9f461#

我希望我能帮助你和其他人解决这个问题。
创建OffscreenCanvas错误是因为它是here中所述的实验性技术。
因此，可能会产生错误、漏洞、故障等。我根据自己的经验提出的建议在node_modules/chart.js/types/index.esm.d.ts（500）中：

export declare type ChartItem =
  | string
  | CanvasRenderingContext2D
  // | OffscreenCanvasRenderingContext2D
  | HTMLCanvasElement
  // | OffscreenCanvas
  | { canvas: HTMLCanvasElement}// | OffscreenCanvas }
  | ArrayLike<CanvasRenderingContext2D | HTMLCanvasElement>;// | OffscreenCanvas>;

在DeepPartial的情况下，在我的情况下，我在node_modules / chart.js / types / utils.d.ts中做了什么（13和14）：

13  type _DeepPartialArray<T> = Array<Partial<T>>
14  type _DeepPartialObject<T> = { [P in keyof T]?: Partial<T[P]> };

我所做的就是改变

Array<DeepPartial<T>>

到

Array<Partial<T>>

和

{[P in keyof T] ?: DeepPartial<T[P]>}

到

{[P in keyof T] ?: Partial<T[P]>}

由于循环引用是用DeepPartial创建的，并且通常会出现错误，因此我的引用是用另一种语言编写的，但无论如何我都会与您分享
https://www.youtube.com/watch?v=aMfvQLLqbzE&ab_channel=makigas%3Atutorialesdeprogramaci%C3%B3n
我正在使用chart.js创建一些带有MEAN Stack的图表，它给我带来的问题比编译中的任何问题都多，因为图表和应用程序仍然可以工作。
这是一个真实的的解决方案，因为我已经研究了将近一个星期，你的问题是我在整个互联网上发现的最准确的问题，有完全相同的错误，但仍然没有答案，我想是因为它是最近的事情，还没有影响到质量，这些错误的真正解决方案或纠正还没有出来。
大家好！

赞(0）回复(0）举报 2023-09-28

4zcjmb1e2#

尝试将其安装为angular应用程序中的dev依赖项