React, WebPack and Babel for Internet Explorer 10 and below produces SCRIPT1002: Syntax error

Question

I\'ve read multiple threads regarding similar issues and tried some propositions, but had no results.

I\'ve followed few tutorials related to React.js

Answer 1

Simply add devtools : "source-map" to your Webpack config like this:

const path = require('path');
module.exports = {
  devtool: "source-map",
  entry: ['babel-polyfill', path.resolve(__dirname, './js/main.js')],
  mode: 'production',
  output: {
    path: __dirname+'/js/',
    filename: 'main-webpack.js'
  }
};

This will remove eval and change your source map to be supported by IE.

UPDATE I've changed devtool to inline-cheap-module-source-map and got error point to overlay.js -> const ansiHTML = require('ansi-html');

And to support ES6 syntax you have to compile your JavaScript code with Babel.

Answer 2

In your package.json file

change the version of webpack-dev-server to version "2.7.1" (or earlier).

"webpack-dev-server": "2.7.1"

Then do a npm install et voilà.

That solved the problem for me.

All versions after 2.7.1 gives me an error similar to yours.