Getting started sample gives: [MobX] Cannot obtain atom from undefined

[jtheisen]

Bug report

On the getting-started page of the current documentation as it shows on mobx-state-tree.js.org, the first sample with any output gives the error message in the subject line.

It also does this in my vanilla create-react-app on this first attempt to try mst.

[peterboyer]

@jtheisen What version of mobx are you using?

I only started seeing this error after upgrading to "mobx": "^6.0.0", whereas the documentation for MST only mentions support for mobx 5.

[jtheisen]

@ptboyer Indeed that works, thanks a lot!

The docs' samples are not locked to a major version.

[peterboyer]

@jtheisen Glad that helped! 😃

Not sure about the "docs' samples not being locked to a major version", but the supported major versions of MobX are stated in the Installation section: "However, for MobX version 4 or 5 can be used."

[makarov-roman]

any ideas what should we do to support mobx 6?

[Romanior]

There is a WIP PR to support Mobx6 https://github.com/mobxjs/mobx-state-tree/pull/1569. the sandbox demo is on mobx 6

[peterboyer]

@Romanior Great! 😄

[elliothershberg]

Hi! I hit this issue also. Is there a package.json that could be used to getting the sandboxes in the tutorial working again? When I tried specifying a version of Mobx, I ran into issues with the other dependencies.

[elliothershberg]

Reinstalling using: yarn add [email protected] mobx-react mobx-state-tree worked for me to get the demo code to work 👍

[adamerose]

Reinstalling using: yarn add [email protected] mobx-react mobx-state-tree worked for me to get the demo code to work 👍

This led me to get this error: https://github.com/mobxjs/mobx-react-lite/issues/319

I had to do npm install mobx@5 mobx-react@6 mobx-state-tree

The mobx-state-tree docs should be updated to reflect this since the latest versions of mobx (6) and mobx-react (7) are not supported and broke all the demos.

[tejaspda]

I am still facing this issue any suggestion how to fix it from PR does it not available if I do npm install mobx-state-tree

[ghost]

same error

[kuasha420]

@stfenjobs An RC is available for latest mobx/mobx-react(-lite). Try it with

yarn add mobx-state-tree@rc

[dpyeates]

mobx-state-tree@rc works for me, thanks.

[eunsukimme]

mobx(v6.0.1), mobx-react(v7.0.0), mobx-state-tree(v4.0.1-rc.1) In codesandbox, above versions works for me.

[justin-hackin]

Thanks for your efforts to get Mobx6 supported! Wanted to get switched over to react-mobx-lite too so I tried installing the RC version but I encountered the following error (probably because I'm using hooks and provider to get state into my components). Not sure which package is responsible though...

Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.
    at resolveDispatcher (:9080/home/cosmo/code/spacecraft-net-factory/node_modules/react/cjs/react.development.js:1465)
    at Object.useState (:9080/home/cosmo/code/spacecraft-net-factory/node_modules/react/cjs/react.development.js:1496)
    at Object.useForceUpdate (:9080/home/cosmo/code/spacecraft-net-factory/node_modules/mobx-react-lite/lib/utils/utils.js:22)
    at Object.useObserver (:9080/home/cosmo/code/spacecraft-net-factory/node_modules/mobx-react-lite/lib/useObserver.js:20)
    at :9080/home/cosmo/code/spacecraft-net-factory/node_modules/mobx-react-lite/lib/observer.js:26
    at renderWithHooks (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:14804)
    at updateFunctionComponent (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:17035)
    at updateSimpleMemoComponent (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:16973)
    at updateMemoComponent (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:16862)
    at beginWork (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:18683)

[kasim444]

If you update the mobx-state-tree package, the problem will probably be resolved. At least it was the solution for me.

yarn upgrade mobx-state-tree --latest

[ashokkumar88]

Reinstalling using: yarn add [email protected] mobx-react mobx-state-tree worked for me to get the demo code to work

@elliothershberg Can you please inform which version are you using for mobx-react and mobx-state.tree? I am getting error mobx.makeObservable in not a function.

[soadzoor]

I ran into this problem when upgraded from v5 to v6. The solution was to add the makeObservable(this) to the constructors for classes, that used the @observer decorator. For that I used this script: https://www.npmjs.com/package/mobx-undecorate npx mobx-undecorate --keepDecorators

Unfortunately it messed up my indentations (from tabs to spaces) in the constructors, and it complained about casting in typescript (eg.: <T> item needed to be converted to item as T), but other than that, it worked fine.

[coolsoftwaretyler]

Hey folks,

Thanks to all who helped out on this one. Looks like the fix was just to get support for MobX 6, which landed.

Thread has been inactive for a while so I'm gonna close it out.