1

一直在尝试学习如何创建/分发一个 npm 包,并且我已经编写了我的第一个使用 ResizeObserver API 的库,目前该 API 拥有大约 89.6% 的全球支持。

我想捆绑一个文件,其中也包含resize-observer-polyfill库的一部分,因此有人可以将其导入为 import <library-name> from "<library-name>/polyfilled";

我已经使用TSDX来生成项目,目前只是发送 index.ts 文件以及 index.d.ts 类型文件。在 index.ts 文件中,有一个在内部使用调整大小观察器的函数。

我不确定如何创建设置来处理这个问题,如果它可以纯粹通过更改配置来包含它(TSDX 使用汇总)或者我需要做其他事情,比如动态导入模块,但是不确定这在捆绑包大小方面如何工作,以及是否会添加到整个库大小中。

// index.js
(async () => {
    if (!ResizeObserver in window) {
        const module = await import('resize-observer-polyfill');
        window.ResizeObserver = module.ResizeObserver
    }
}();

// main function exported
export default () => {
    function loadResizeObserver() {
        const ro = new ResizeObserver((entries) => {
            // ...
        })
    }
}

处理向库添加 polyfill 的最佳方法是什么。或者如果需要,我应该只指向消费者添加的polyfill?

4

1 回答 1

0

我建议不要在库中包含 pollyfill,因为它会增加你的包的大小。

如果最终用户需要,只需添加什么和如何使用 pollyfills 的详细信息,以便需要这种支持的开发人员(显然对于旧浏览器)可以很容易地添加它。

默认情况下添加会增加大小,对于那些专注于最新版本浏览器的人来说,这将导致未使用的代码。

于 2021-01-19T11:04:43.663 回答