create-react-app not working with IE11 in development mode

[dcp12345678]

Is this a bug report?

yes

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

Unknown

(Write your answer here.)

Which terms did you search for in User Guide?

(Write your answer here if relevant.)

Environment

1. node -v:
   v6.11.2

2. npm -v:
   3.10.10

3. yarn --version (if you use Yarn):
   N/A

4. npm ls react-scripts (if you haven’t ejected):
   react-scripts@1.0.12

Then, specify:

1. Operating system:
   Windows 7
2. Browser and version (if relevant):
   IE 11

Steps to Reproduce

(Write your steps here:)
I am on Windows 7, so these instructions reflect that environment.

1. create-react-app my-app
2. cd my-app
3. npm start
4. In IE11, navigate to http://localhost:3000
5. Press F12
6. Press F5
7. You will see an error about Object.assign not being defined.

Expected Behavior

(Write what you thought would happen.)

I expect not to get an error.

Actual Behavior

Got the error about Object.assign

(Write what happened. Please add screenshots!)

Reproducible Demo

(Paste the link to an example project and exact instructions to reproduce the issue.)

[gaearon]

Hmm. Would it make sense if we ran the polyfills first? I guess there's some minor chance they could throw, but not sure if that's a good tradeoff.

[dcp12345678]

One can manually add <script src="//cdn.polyfill.io/v2/polyfill.min.js"></script> to the index.html and that seems to fix the issue, but lit seems like this step shouldn't be necessary.

[Timer]

@dcp12345678 it's only necessary for development; the application should work fine when built for production.

I believe the polyfills should be first in our entry point (or at least before the overlay), what edge cases are you talking about, @gaearon?

[gaearon]

I guess let's just fix the code to use object spread? Babel will use its own helper for this.
Happy to take a PR fixing it.

[tharakawj]

I'll send a PR.

[tharakawj]

Apparently, we are already using object spread and Babel transform it to Object.assign.
https://github.com/facebookincubator/create-react-app/blob/v1.0.12/packages/react-error-overlay/src/components/CodeBlock.js#L24-L27

Can you think of any other workaround without changing execution order?

[tharakawj]

It seems we need to disable useBuiltIns option to use Babel’s extends. https://github.com/facebookincubator/create-react-app/blob/master/packages/babel-preset-react-app/index.js#L20

will it be a good workaround?

[gaearon]

Oh I see. Well, let's just depend on object-assign in that module and import it explicitly with import assign from 'object-assign'.

[gaearon]

This should be fixed in 1.0.13. Please verify.

https://github.com/facebookincubator/create-react-app/releases/tag/v1.0.13

[dcp12345678]

I just verified it and the fix works great. Thanks so much @tharakawj and @Gearon!

[taviroquai]

Hi, I'm facing this issue and I'm not sure If my version includes this fix.

I saw pointing out to v1.0.13 but when I do npm list -g, I get:

create-react-app@1.4.1

The only way I can overcome this, is by adding the script tag in the index.html pointing to the cdn service - which I really don't like this solution.

I tried importing 'core-js/es6' in the top of my index.js but when running, it stills complains about Object.assign() in the react-error-overlay/CodeBlock.js

Any hints are helpfull. Thanks.

[gaearon]

As explained in the beginning of the user guide (which you should also see as README in the generated project), the version of create-react-app itself almost never matters.

The version that matters is the react-scripts version in your package.json. When we fix something, we release a react-scripts update, and you can use it by following the instructions I linked above.

I hope this helps!

[taviroquai]

@gaearon thank you I was using 1.0.12. I just updated my package.json and installed 1.0.13, so part of my problem is solved, still can't render in IE11.

[gaearon]

Can you please update to the latest version (1.0.16)?
If you still have problems please file a new issue with a description, screenshot, etc.

Thanks!