Requirejs 和 polyfill.io 混搭

问题描述

我在 IE11 和 Safari 12 上添加这两个库时遇到问题。 IE11 和 Safari 12 引发错误，因此我无法使用 ResizeObserver。但是，它们分别正常工作或以相反的顺序工作。可能是什么问题以及如何解决？

<!DOCTYPE html>
<html>
<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js" crossorigin="anonymous"></script>
  <script src="https://polyfill.io/v3/polyfill.min.js?features=ResizeObserver" crossorigin="anonymous"></script>
</head>
<body>
  <div id="demo"></div>
</body>
</html>

调试源：https://jsbin.com/yacovakupu/edit?html,output

解决方法

您正在使用 RequireJS 并且 polyfill.io 确实支持 AMD，因此您需要使用 RequireJS 加载它：

<!DOCTYPE html>
<html>
<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js" crossorigin="anonymous"></script>
</head>
<body>
  <div id="demo"></div>
  <script>
    require(['https://polyfill.io/v3/polyfill.min.js?features=ResizeObserver'],function (ResizeObserver) {
      console.log(ResizeObserver)

      var demo = document.getElementById("demo");
      demo.innerHTML = ResizeObserver;
    });
  </script>
</body>
</html>

javascript polyfills