Webpack-dev-server: IE 11: using dev-server with hot=true fails due to use of unsupported Array.includes()

[Q-Man]

• Operating System: Windows 10
• Node Version: 8.9.0
• NPM Version: 5.5.1
• webpack Version: 4.1.1
• webpack-dev-server Version: 3.1.1

• [x] This is a bug
• [ ] This is a modification request

This repository demonstrates the problem in a minimal setup:
https://github.com/Q-Man/webpack-dev-server-ie-fail

Code

  // webpack.config.js
const webpack = require('webpack');
const path = require('path');
const buildPath = path.resolve(__dirname, './dist');
const srcPath = path.resolve(__dirname, './src');
const TransferWebpackPlugin = require('transfer-webpack-plugin');

const config = {
    entry: {
        devServer: 'webpack/hot/only-dev-server',
        index: "./src/app/index.jsx"
    },
    resolve: {
        extensions: [".js", ".jsx"],
    },
    plugins: [
        //Moves files
        new TransferWebpackPlugin([
            {from: 'www'},
        ], path.resolve(__dirname, "./src")),
    ],
    output: {
        path: buildPath,    //Path of output file
        filename: '[name].js',
    },
    mode: "development",
    module: {
        rules: [
            {
                test: /\.js$|\.jsx$/,
                include: [srcPath],
                use: {
                    loader: "babel-loader",
                    options: {
                        presets: ['es2015', 'react']
                    }
                }
            },
        ],
    },
    //Server Configuration options
    devServer: {
        contentBase: 'src/www',  //Relative directory for base of server
        hot: true,        //Live-reload
        inline: true,
        port: 3000,        //Port Number
        host: 'localhost',  //Change to '0.0.0.0' for external facing server
    },
    plugins: [
        new webpack.HotModuleReplacementPlugin(),
    ],
};

module.exports = config;

Expected Behavior

webpack-dev-server should serve the application in IE 11 without error.

Actual Behavior

Error in javascript-console: SCRIPT438: Object doesn't support property or method "includes"

The problem is the use of Array.includes() in webpack-dev-server which is not supported by IE 11.

For Bugs; How can we reproduce the behavior?

Clone this repository:
https://github.com/Q-Man/webpack-dev-server-ie-fail

1. npm i
2. npm start
3. run http://localhost:3000 in IE 11

[The-Bobby]

I was having this issue too. Looks like they're taking care of it.

https://github.com/webpack/webpack/commit/fcf634c81956b7959f83bc9f140db37cc628e92a#diff-f995afcfa4e47968fef81836a5da0bca

[The-Bobby]

Looks like it's fixed in the last release! Let us rejoice!

https://github.com/webpack/webpack/releases/tag/v4.2.0

[Q-Man]

Yes, it's working now with webpack 4.2.0. I'm closing this issue.

[MaximeHeckel]

I know this has apparently been fixed in webpack 4.2.0, but I'm seeing the same exact issue in webpack 4.5.0
Any idea how this could happen?
I seem to have got some versioning issues here, and ended up on the wrong webpack version.

[Q-Man]

Ok. It's working for me in webpack 4.5.0