search

esxjs / esx

Like JSX, but native and fast
MIT License
654 stars 11 forks source link

Not working with react-redux hooks API #13

Open irudoy opened 5 years ago

irudoy commented 5 years ago 
Invalid hook call. Hooks can only be called inside of the body of a function component.
    at /esx-repro-rr/node_modules/react-dom/cjs/react-dom-server.node.development.js:1136:26
    at resolveCurrentlyRenderingComponent (/esx-repro-rr/node_modules/react-dom/cjs/react-dom-server.node.development.js:1139:5)
    at Object.useContext (/esx-repro-rr/node_modules/react-dom/cjs/react-dom-server.node.development.js:1284:3)
    at Object.useContext (/esx-repro-rr/node_modules/esx/lib/hooks/compatible.js:51:21)
    at useContext (/esx-repro-rr/node_modules/react/cjs/react.development.js:1633:21)
    at useReduxContext (/esx-repro-rr/node_modules/react-redux/lib/hooks/useReduxContext.js:31:44)
    at useSelector (/esx-repro-rr/node_modules/react-redux/lib/hooks/useSelector.js:121:28)
    at A (/esx-repro-rr/app.esx.js:19:16)
    at renderComponent (/esx-repro-rr/node_modules/esx/index.js:516:18)
    at resolveChildren (/esx-repro-rr/node_modules/esx/index.js:956:25)

Repro: https://github.com/irudoy/esx-repro-rr

davidmarkclements commented 5 years ago

looking into this

irudoy commented 4 years ago

any news?

davidmarkclements commented 4 years ago

so the issue in this specific case is the package-lock.json enforcing multiple versions of React

if you remove the package-lock (and rm -fr node_modules) reinstall it will run but create a different error:

/esx-repro-rr/node_modules/esx/lib/hooks/compatible.js:51
    : reactDispatcher.useContext(context)
                      ^

TypeError: Cannot read property 'useContext' of null
    at Object.useContext (/esx-repro-rr/node_modules/esx/lib/hooks/compatible.js:51:23)
    at useContext (/esx-repro-rr/node_modules/react/cjs/react.development.js:1493:21)
    at useReduxContext (/esx-repro-rr/node_modules/react-redux/lib/hooks/useReduxContext.js:27:44)
    at useSelector (/esx-repro-rr/node_modules/react-redux/lib/hooks/useSelector.js:114:28)
    at A (/esx-repro-rr/app.esx.js:19:16)
    at renderComponent (/esx-repro-rr/node_modules/esx/index.js:523:18)
    at resolveChildren (/esx-repro-rr/node_modules/esx/index.js:964:25)
    at Object.childPropsGetter [as children] (/esx-repro-rr/node_modules/esx/index.js:533:27)
    at Provider (/esx-repro-rr/node_modules/react-redux/lib/components/Provider.js:21:23)
    at Object.renderComponent (/esx-repro-rr/node_modules/esx/index.js:523:18)

Which needs to be addressed separately.

The reason for the failure is that hooks/compatible.js loads whichever react is available to esx and then overrides internals to deal with these hooks constraints. If there's two versions of react in the tree, then there's a chance that it will override the react instance which isn't being used in the actual application. Unfortunately package-lock files make the chances of two react instances being installed more likely.

The reason for the new failure, I think, is that react internals have changed slightly and we need to sync the way we override to make this work.

prograhammer commented 4 years ago

Cannot read property 'useContext' of null

I encountered this when using a context provider and a child inside with useContext.

After a big deep dive today, I was starting to conclude this as well:

The reason for the new failure, I think, is that react internals have changed slightly and we need to sync the way we override to make this work.
catamphetamine commented 2 years ago

On my machine, Next.js didn't work if, in Windows Terminal, the disk letter (for example, C:) of the "current directory" was written in lowercase (as c: in this example).

After I changed the current directory from c:\dev\project to C:\dev\project, the error went away.

Source: https://github.com/vercel/next.js/issues/7626#issuecomment-541430221