Angular项目中chartjs-plugin-crosshair插件失效及TS报错解决

问题场景 #

在Angular项目中使用chart.js@4.1.2和chartjs-plugin-crosshair@1.2.0实现关联图表的十字准线效果时，出现两个TypeScript错误：

• error TS2305: 模块"chartjs-plugin-crosshair"没有导出成员"Interpolate"
• error TS2339: InteractionModeMap类型不存在"interpolate"属性
  同时插件配置无法生效，十字准线效果无法正常显示。

修复步骤 #

1. 在项目的src目录下创建一个名为index.d.ts的类型声明文件
2. 在该文件中添加以下代码：

declare module 'chartjs-plugin-crosshair';

3. 重启项目的开发服务器，此时TypeScript错误会被消除，插件的十字准线配置也能正常生效，实现预期的关联图表交互效果。

内容的提问来源于stack exchange，提问作者sakayevas