angular - Chart.js 3+、Firefox 68 和 Angular : "ReferenceError: "ResizeObserver is not defined"

Question

我有一个使用 Chart.js 3+ 的 Angular 应用程序，它需要在 Firefox 68 中运行。

Chart.js 3+ 在其代码中使用 ResizeObserver，该特定 Firefox 版本不支持它。

因此，当我尝试在 Firefox 中加载我的图表时，出现以下错误:

ReferenceError: "ResizeObserver is not defined"

在其他浏览器或更新版本的 Firefox 中它可以正常工作。

经过一些研究，我了解到我可以为 ResizeObserver 安装一个 polyfill，许多人建议如下:https://github.com/juggle/resize-observer

所以我通过键入 npm i @juggle/resize-observer 将它安装在我的项目中，然后将它添加到 polyfill.ts 文件中:

import '@juggle/resize-observer';
import 'zone.js/dist/zone'; 

但是错误依然存在。我错过了什么吗？

提前致谢。

Answer 1

看看其他人是如何修复它的，似乎你仍然需要在对 chart.js 做任何事情之前将它注册到浏览器，这样它才能使用它:

import {ResizeObserver as ResizeObserverPolyfill} from '@juggle/resize-observer';

if (typeof window !== 'undefined') {
  window.ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;
}

来自:https://github.com/jenkins-infra/plugin-site/pull/714