Question

我正在尝试使用动态导入在我的React应用程序中进行一些条件导入。看起来我可以只使用babel-plugin-syntax-dynamic-import来在大多数浏览器中使用此功能。

因此，我有两个webpack目标，一个是为较旧的浏览器构建的，然后将babel-polyfill放入了入口点。对于该目标非常有效。第二个目标，希望针对支持ES6的浏览器，没有polyfill。看起来像这样：

  entry: {
    'home': './web/home.js',
  },
  output: {
    filename: '[name].js',
    path: __dirname + '/dist'
  },
  devtool: 'source-map',
  mode: 'development',
  module: {
    rules: [{
      test: /\.js$/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: [
            'react',
            ['env', {
              modules: false,
              useBuiltIns: true,
              targets: {
                browsers: [
                  'Chrome >= 61',
                  'Safari >= 11',
                  'iOS >= 11.2',
                  'Firefox >= 60',
                  'Edge >= 16',
                ],
              },
            }],
          ],
          plugins: [ 'syntax-dynamic-import' ]
        },
      },
    }],
  },
  resolve: {
    extensions: ['.js', '.jsx'],
    symlinks: false
  },
},

但是，生成的捆绑包不起作用，似乎需要regeneratorRuntime（即使我认为我指定的浏览器应支持关键的ES6功能）。在动态导入的React组件中，我得到了这个堆栈跟踪。跟踪中的每个行号都对应于FirebaseOptions类的方法的右括号。

Uncaught (in promise) ReferenceError: regeneratorRuntime is not defined
at FirebaseOptions.react.js:9
at FirebaseOptions.react.js:16
at Module../web/components/FirebaseOptions.react.js (FirebaseOptions.react.js:50)
at __webpack_require__ (bootstrap:63)

这是否意味着语法动态导入生成需要regeneratorRuntime的代码？还是还有其他我想念的东西？

是否需要babel-polyfill使用babel-plugin-syntax-dynamic-import？出现RegeneratorRuntime错误

0 个答案: