IE11 fails in dev mode due to template literal in webpackHotDevClient.js

[felthy]

Commit 00ed100 introduced a template literal (backtick) at line 29 of webpackHotDevClient.js. Replacing this with old-school launchEditorEndpoint + '?fileName=' gets the dev server working in IE11 again.

I've found other issues (e.g. #1881) that indicate care has been taken to keep the runtime code ES5-compatible, so I suspect this was unintentional.

Is this a bug report?

Yes

Can you also reproduce the problem with npm 4.x?

Yes

Which terms did you search for in User Guide?

IE11; browser; support; version; webpackHotDevClient

Environment

1. node -v: v8.6.0
2. npm -v: 5.3.0
3. yarn --version (if you use Yarn): 1.2.1
4. npm ls react-scripts (if you haven’t ejected): react-scripts@1.0.15

Then, specify:

1. Operating system: Windows 8.1
2. Browser and version (if relevant): Internet Explorer 11.0

Steps to Reproduce

~ $ create-react-app ie11test
~ $ cd ie11test/
ie11test $ yarn start

Then open localhost:3000 in Internet Explorer 11.

Expected Behavior

Should see the "Welcome to React" page.

Actual Behavior

IE11 shows a blank white page with the following error in the F12 Developer Tools console:

❌ SCRIPT1014: Invalid character
File: bundle.js, Line: 6335, Column: 5

That reference corresponds to react-dev-utils/webpackHotDevClient.js:29:

    `${launchEditorEndpoint}?fileName=` +
----^

Reproducible Demo

Reproducible with the default output from create-react-app, no other changes required.

[dep-deprecated]

To anyone who ends up here still having problems, I found success using babel-engine-plugin to transpile the necessary node_modules for ie11.