Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problems updating to React 15.4.0 #417

Closed
albertolive opened this issue Nov 16, 2016 · 29 comments
Closed

Problems updating to React 15.4.0 #417

albertolive opened this issue Nov 16, 2016 · 29 comments

Comments

@albertolive
Copy link

Hi @gaearon, as you mentioned in this previous post, apps should not rely on internal APIs. I checked into my node_modules folder and I found that this project requires ReactMount. It's in here

What can I do?

Thank you!

@gaearon
Copy link
Owner

gaearon commented Nov 16, 2016

React Hot Loader 1.x has been unsupported for over a year.
Please switch to 3.x!

@albertolive
Copy link
Author

Hi @gaearon!

Sorry, I didn't want to change before a stable version. I switched to 3.x and all works fine.

Thank you again!

@gaearon
Copy link
Owner

gaearon commented Nov 16, 2016

3.x is technically more stable than 1.x IMO.
@calesce What's blocking 3.x release?

@th3fallen
Copy link

@gaearon on that topic is there a migration guide? the one i see is migrating TO 1.x not from it

@calesce
Copy link
Collaborator

calesce commented Nov 16, 2016

@gaearon @albertolive better/more documentation, and #391 and #313, possibly a few more under 3.0 milestone

@calesce
Copy link
Collaborator

calesce commented Nov 16, 2016

@th3fallen check out next-docs

@th3fallen
Copy link

So after spending about 2 hours trying to get v3 to work (unsuccessfully, it would detect changes but say they couldnt be reloaded i assume because they're wrapped with HOC's for redux?)
I've given up.

Since v3 is still labeled as a beta would it be possbile to make v1 work until it's the new stable? or is that a big ask?

@calesce
Copy link
Collaborator

calesce commented Nov 16, 2016

@th3fallen can you open a separate issue with a reproduce project?

Since v3 is still labeled as a beta would it be possbile to make v1 work until it's the new stable? or is that a big ask?

I don't think so, the focus has been on 3.0 and it has an improved architecture, but still a few bugs. I recommend checking out Dan's blog post.

@omichelsen
Copy link

omichelsen commented Nov 16, 2016

As I understand it, you can't just switch to v3 without also adding the bootstrap <AppContainer /> to your app root?

If there is anyway we could just upgrade and leave that for later, I would appreciate any instructions, because we have a lot of entry points, and this would be a major refactor for us.

@renaudl
Copy link

renaudl commented Nov 17, 2016

so what is the solution there. roll back react version?

@gaearon
Copy link
Owner

gaearon commented Nov 17, 2016

It doesn't seem very wise to me to roll back a version of a project that is actively being developed (React) in order to keep compatibility with a tool version that was abandoned a long time ago (RHL 1.x).

@gaearon
Copy link
Owner

gaearon commented Nov 17, 2016

If the current approach taken in 3.x doesn't work for you I could see a way to make it work more like 1.x did. But it needs someone to actually work on it. I've been working on hot reloading for a long time and I'd appreciate somebody else taking initiative this time.

@calesce
Copy link
Collaborator

calesce commented Nov 17, 2016

As I understand it, you can't just switch to v3 without also adding the bootstrap to your app root?

You can use plain Webpack HMR, where you'd still need to add module.hot.accept calls in each entry point, for starters. You could also probably migrate one entry point at a time if you're concerned about scale of refactoring.

@renaudl
Copy link

renaudl commented Nov 17, 2016

@gaearon in the long run, I agree but when you have a set of stuck developer you have to pay... Will try to move to 3.X in parallel.

@gaearon
Copy link
Owner

gaearon commented Nov 17, 2016

You can fork and change react/lib/ReactMount to react-dom/lib/ReactMount if you're stuck. But this will too break someday.

@renaudl
Copy link

renaudl commented Nov 17, 2016

Thanks for advise

@jtangelder
Copy link

jtangelder commented Nov 18, 2016

Adding alias: { 'react/lib/ReactMount': 'react-dom/lib/ReactMount' } to your webpack config fixes this for now. Meanwhile I'm looking forward to see 3 go final! 😉

@ghost
Copy link

ghost commented Nov 22, 2016

Thanks for advise @jtangelder

@DimitryDushkin
Copy link

After upgrade to React 15.4 I have error

SCRIPT5022: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, ref, props, _owner, _store}). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method of `RedBoxError`.

in IE11.

RHL uses RedBox. I've create issue in RedBox for this commissure/redbox-react#82, but I'm no really sure it's RedBox issue. Trying to figure it out.

@gaearon
Copy link
Owner

gaearon commented Nov 22, 2016

Appears related: facebook/react#8379.
Can you share a reproducing example?

@DimitryDushkin
Copy link

DimitryDushkin commented Nov 22, 2016

I'll try Den. Currently I've figured out that only dev build with RHL included is affected. Production build with React 15.4 is okay.

@hyy1115
Copy link

hyy1115 commented Nov 24, 2016

@jtangelder good idea

d4rkr00t added a commit to d4rkr00t/aik that referenced this issue Nov 25, 2016
In React 15.4.0 facebook completely removed ReactDOM from React package itself. React-Hot-Loader
depends on some internal libs inside react package which made it imposible to use since version 15.4
arrived. To work around this issue I had to make some changes which led to only support react 15.4+
in aik.

Related links:
https://facebook.github.io/react/blog/2016/11/16/react-v15.4.0.html
gaearon/react-hot-loader#417 (comment)

Since this commit react-hot-loader (-r option) works only for react 15.4+
@calesce
Copy link
Collaborator

calesce commented Nov 28, 2016

Fixed in 1.3.1 by #430.

This will be the last 1.X release, and ReactMount will continue to be changed on minor versions, so please move to 3.0 as soon as you can.

@calesce calesce closed this as completed Nov 28, 2016
@DimitryDushkin
Copy link

DimitryDushkin commented Nov 28, 2016

By the way I've found out what was the problem with IE11: problem was within code in node_modules which is excluded in babel loader in webpack (for performance reasons):

var REACT_ELEMENT_TYPE = typeof Symbol === 'function' && Symbol['for'] && Symbol['for']('react.element') || 0xeac7;

At first react requires it when there is no Symbol polyfill and then some code require it where there is Symbol polyfill, so (as far as I understand) on phase "Building VDOM" REACT_ELEMENT_TYPE equals to number and on "validation" phase REACT_ELEMENT_TYPE equals instance of Symbol object.

Still do not understand why it happened, but adding babel-polyfill helped.

UP: even simpler solution https://github.com/thejameskyle/babel-react-optimize/issues/16#issuecomment-263519239

@gaearon
Copy link
Owner

gaearon commented Dec 5, 2016

As for IE11 problem, also see this: facebook/react#8379 (comment).

@codingwesley
Copy link

codingwesley commented Dec 15, 2016

what should i do ?update version to 3

@gaearon i have some question, thx your code.

npm install --save-dev react-hot-loader@next

@bytor99999
Copy link

Updating to 3 did not fix the problem. I still get ERROR in ./js/components/inputs/maskedInput.jsx
Module not found: Error: Can't resolve 'react/lib/ReactInputSelection'

going to try the alias suggestion.

@rodoabad
Copy link

Upgrading to 3.x now causes a new error.

records.chunkModuleIds[chunk.id] = chunk.mapModules(m => m.id);

chunk.sortModules is not a function

@theKashey
Copy link
Collaborator

@rodoabad - it sounds like webpack, not RHL.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests