Getting Babel 6 to work with IE8 (via. Gulp/Webpac

2019-03-26 23:52发布

问题:

I've got Babel 6 working nicely with Gulp and Webpack. I now need to polyfill it to get IE8 support.

I've installed the babel-polyfill, but can't get it working and the docs and Google haven't helped so far.

My Gulp task (inc. Webpack config):

gulp.task('webpack', function(callback) {
  var webpackConfig = {
    context: __dirname + '../../../js',
    entry: {
      homepage: [
        'babel-polyfill',
        './public/homepage/homepage.js'
      ]
    },
    output: {
      path: __dirname + '../../../dist/public/scripts/',
      filename: '[name].bundle.js'
    },
    module: {
      loaders: [
        {
          loader: 'babel-loader',
          test: /\.js$/, // Only run .js files through Babel
          include: /js/, // Only include the /js dir
          query: {
            //plugins: ['transform-runtime'], // Disabled pending fix to https://github.com/babel/babel/issues/2954
            presets: ['es2015'],//, 'stage-0'
          }
        }
      ]
    }
  };

  webpack(webpackConfig, function(err, stats) {
    if (err) {
      throw new gutil.PluginError('webpack', err);
    }

    gutil.log('[webpack]', stats.toString({
      // output options
    }));

    callback();
  });
});

From the docs (https://babeljs.io/docs/usage/polyfill/):

Usage in Node / Browserify / Webpack

To include the polyfill you need to require it at the top of the entry point to > your application.

require("babel-polyfill");

Usage in Browser

Available from the dist/polyfill.js file within a babel-polyfill npm release. This needs to be included before all your compiled Babel code. You can either prepend it to your compiled code or include it in a before it.

NOTE: Do not require this via browserify etc, use babel-polyfill.

I've tried simply adding the polyfill.js file to the top of the page, but IE8 still isn't happy with the compiled code's use of the default keyword.

I've also tried adding the polyfill to the webpack process, as per http://jamesknelson.com/using-es6-in-the-browser-with-babel-6-and-webpack/ and other suggestions from Google

What am I doing wrong?