时间戳

首页 > 解决方案 > useBuiltIns/babel polyfill 中的目标浏览器选项

reactjs - useBuiltIns/babel polyfill 中的目标浏览器选项

问题描述

我想使用 'useBuiltIns' 选项仅为 IE11 浏览器加载 polyfill。

[
    '@babel/preset-env',
    {
        useBuiltIns: 'entry',
        debug: true,
        modules: false,
        corejs: '3',
        targets: {
            node: true,
            browsers: [
                'ie >= 11',
            ]
        },
    },
]

这里是入口文件导入。

import "core-js/stable";
import "regenerator-runtime/runtime";

但是，我可以看到 core-js 的入口点也加载了 chrome 和 safari 的所有 polyfill，这增加了文件大小。如何指定仅为 IE 加载 polyfill 的选项？我尝试添加特定版本的 chrome，但没有成功。

标签： reactjsinternet-explorer-11babeljspolyfillsbabel-polyfill

解决方案

Babel cherry 会根据您的配置为您挑选 polyfill。如果您只想为代码添加 polyfill，请在下面更改，您的代码库中需要转译。条目设置将添加所有内容

{ useBuiltIns: 'usage',

您的目标应该只包含 browser defined ，检查语法。例如

  "targets": {
    "chrome": "58",
    "ie": "11"
  }

推荐阅读