react es6项目无法在Safari和Internet Explorer上运行

时间:2018-12-20 07:17:46

标签: javascript reactjs babel babel-loader babel-polyfill

我正在研究基于React / redux的项目,其中我正在使用Ecma Script 6(ES6)。该项目可在Chrome和Firefox上成功运行,但无法在Safari和Internet Explorer(IE)上运行。

我知道何时打开Safari&IE的控制台。 我还配置了babel。我有一个babel.config.js,如下所示。

module.exports = function (api) {
  api.cache(true)

  const isProd = process.env.NODE_ENV === 'production'

  const presets = ['@babel/preset-react']
  const plugins = [
    '@babel/plugin-syntax-dynamic-import',
    '@babel/plugin-transform-arrow-functions',
    ['@babel/plugin-proposal-decorators', { legacy: true }],
    ['@babel/plugin-proposal-class-properties', { loose: true }],
    [
      '@babel/plugin-transform-runtime',
      {
        corejs: 2,
        regenerator: false,
        useESModules: true,
      },
    ],
    'react-hot-loader/babel',
  ]

  if (isProd) {
    presets.push([
      '@babel/preset-env',
      {
        modules: false,
        loose: true,
        useBuiltIns: 'usage',
        exclude: ['transform-regenerator', 'transform-async-to-generator'],
      },
    ])
    plugins.push(
      [
        'module:fast-async',
        {
          compiler: {
            promises: true,
            generators: false,
          },
          runtimePattern: null,
          useRuntimeModule: false,
        },
      ],
      'transform-react-remove-prop-types',
    )
  } else {
    plugins.push('@babel/plugin-syntax-object-rest-spread')
  }

  return {
    presets,
    plugins,
  }
}

作为,我知道constarrow functions的Safari和IE抛出错误未定义且存在语法错误,我在{{1}中为arrow functions添加了以下代码}:

babel.config.js

下图显示了Safari错误,以供参考。 safari arrow function err safari const err

Internet Expolrer也是如此。

有人可以帮助我如何在Safari和IE上运行我的项目。 需要使用哪个插件或polyfill将所有ES6语法转换为浏览器所需的语法。

等待答复和答案。

谢谢

0 个答案:

没有答案