React, Webpack and Babel for Internet Explorer 9
<p>Trying to support IE 9 for React. Upgraded to use <code>babel 6.3.26</code> and <code>babel-preset-es2015</code> and <code>babel-preset-react</code> for Webpack. However, when the file is loaded in IE 9, a syntax error occurs.</p>

<p>webpack.config.js</p>

<pre><code>/* eslint-env node */
var path = require('path');
var packageJson = require('./package.json');
var _ = require('lodash');
var webpack = require('webpack');

var context = process.env.NODE_ENV || 'development';

var configFunctions = {
    development: getDevConfig,
    production: getProdConfig,
    test: getTestConfig
};

var config = configFunctions[context]();

console.log('Building version %s in %s mode', packageJson.version, context);

module.exports = config;

function getLoaders() {
    if (context.indexOf('test') === -1) {
        return [
            {
                test: /\.js?$/,
                exclude: /(test|node_modules|bower_components)/,
                loader: 'babel-loader',
                query: {
                    presets: ['react', 'es2015'],
                    plugins: ['transform-runtime']
                }
            }
        ]
    } else {
        return [
            {
                test: /\.js?$/,
                exclude: /(node_modules)/,
                loader: 'babel-loader',
                query: {
                    presets: ['react', 'es2015'],
                    plugins: ['transform-runtime']
                }
            }
        ]
    }
}

function getBaseConfig() {
    return {
        context: __dirname + "/src",
        output: {
            path: path.join(__dirname, 'dist'),
            filename: 'bundle.js',
            publicPath: '/static/'
        },
        stats: {
            colors: true,
            reasons: true
        },
        resolve: {
            extensions: ['', '.js', '.jsx']
        },
        module: {
            loaders: _.union(
                getLoaders(),
                [
                    {
                        test: /\.scss$/,
                        loader: 'style!css!sass'
                    },
                    {
                        test: /\.eot$|\.svg$|\.woff$|\.ttf$/,
                        loader: 'url-loader?limit=30000&amp;name=fonts/[name]-[hash:6].[ext]'
                    },
                    {
                        test: /\.(png|.jpe?g|gif)$/,
                        loader: 'url-loader?limit=5000&amp;name=img/[name]-[hash:6].[ext]'
                    },
                    {
                        test: /\.mp4$/,
                        loader: 'url-loader?limit=5000&amp;name=videos/[name]-[hash:6].[ext]'
                    }
                ]
            )
        }
    };

}

function getDevConfig() {
    return _.merge({}, getBaseConfig(), {
        devtool: 'cheap-module-eval-source-map',
        entry: [
            'babel-polyfill',
            'webpack-hot-middleware/client',
            './App'
        ],
        plugins: [
            new webpack.optimize.OccurenceOrderPlugin(),
            new webpack.HotModuleReplacementPlugin(),
            new webpack.NoErrorsPlugin()
        ],
        eslint: {
            emitError: false,
            failOnError: false,
            failOnWarning: false,
            quiet: true
        }
    });
}

function getProdConfig() {
    return _.merge({}, getBaseConfig(), {
        devtool: 'source-map',
        entry: [
            'babel-polyfill',
            './App'
        ],
        plugins: [
            new webpack.optimize.DedupePlugin(),
            new webpack.optimize.UglifyJsPlugin({
                minimize: true,
                compress: {
                    warnings: false
                }
            })
        ],
        eslint: {
            emitError: true,
            failOnError: true
        }
    })
}

function getTestConfig() {
    return _.merge({}, getBaseConfig(), {})
}
</code></pre>

<p>Checking <code>bundle.js</code> for the offending lines reveals the usage of <code>const</code> which is not ES5. Am I missing something here? Do I need to transpile ES6 code into ES5 for production usage?</p>