在前端开发中，为了实现跨浏览器的兼容性，我们常常需要引入浏览器的polyfills。polyfills主要是针对那些不支持ES6/7特性的浏览器，通过扩展API来实现浏览器的兼容性。而使用polyfills一般都需要在项目中引入一大堆的JS文件，这样就增加了项目的负担。因此，我们可以通过使用polyfills-db这个npm包来轻松的引入浏览器所需要的polyfills。
polyfills-db简介
polyfills-db是一个npm包，它内置了几乎所有可用的polyfills，并且可以根据浏览器的user agent动态选择需要加载的浏览器特性和所需的polyfills。
安装
首先，我们需要在项目中安装polyfills-db:
--- ------- ------------
使用方法
1.引入
在项目中引入polyfills-db需要的JS文件：
------ ---------------
2.配置
polyfills-db内置了几乎所有可用的polyfills。但是，由于每个项目的需求不同，我们需要手动配置需要使用的polyfills。配置方式如下：
----------
--- --- ---- -- ----------
-
-- ------- --
--
--- -------- --- -- --------------
--其中，需要支持的浏览器列表是一个数组，数组中每个元素表示一个浏览器(由polyfills-db内置)，如下：
---- ----------- - -------- - --------- - ------ - ---- - ---------
需要加载的polyfills是一个数组，数组中每个元素表示所需加载的polyfill功能，如下：
---- ----------- - - ------- - --------- - ------------------ - --------------------- - ---------------------- -- ------
3.使用
这里以使用Promise为例：
-- -------------- ------ --------------- -- ----------------- -------------- -- ----- --- ------------- -- --------- ----- ------- - --- ----------------- ------- -- - -- -- --------- ---------------- --- -- ----------- ---------------- -- - ----------------- ---
注意事项
- 不要在已经支持所有polyfills的浏览器中运行polyfills-db，这样会增加不必要的负载。
- 如果配置了所有的polyfills，会导致加载时间变得非常慢，所以在配置时要小心。
最后，使用polyfills-db能够让我们方便得使用浏览器所需的polyfills功能，在某些情况下甚至能够缩小项目代码的体积。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/74642