reactjs - babel : polyfill Array. 来自 IE11 支持

Question

我目前无法让我的 React 应用程序在 IE11 中运行。问题似乎是一些较新的 ES6 内容在 IE11 中不可用。所以我的目标是填补缺失的功能。我正在使用 nwb [1]，它是 React 应用程序的零配置设置。但是，我不确定如何配置 Babel(或 Webpack？)来填充某些方法，例如 Array.from。看起来 fetch、Promise 和 Object.assign 都经过了 polyfill，但 Array.from 则不然。任何帮助将不胜感激。

这是我的 nwb.config 文件:

module.exports = {
         type: 'react-app',
webpack: {
    define: {
        VERSION: JSON.stringify(require('./package.json').version),
        HOSTNAME: JSON.stringify(process.env.NODE_ENV === 'production' ?
                  'https://xyz.azurewebsites.net' :
                  'http://localhost:8080')
    },
    rules: {
        babel: {
            test: /\.jsx?/
        }
    },
    extra: {
        resolve: {
            extensions: ['.jsx']
        },
        devtool: '#inline-source-map'
    },
    html: {
        favicon: 'src/img/favicon.ico'
    }
}
};

谢谢

[1] React 应用程序的工具包。 https://github.com/insin/nwb

Answer 1

听起来您需要添加 babel-polyfill到您的项目。

This will emulate a full ES2015+ environment and is intended to be used in an application rather than a library/tool. This polyfill is automatically loaded when using babel-node.

This means you can use new built-ins like Promise or WeakMap, static methods like Array.from or Object.assign, instance methods like Array.prototype.includes, and generator functions (provided you use the regenerator plugin). The polyfill adds to the global scope as well as native prototypes like String in order to do this.

对您来说最简单的方法可能是将其导入到主 js 文件的顶部:

import 'babel-polyfill';