What happened to mobx-react/custom for custom renderers

[JoshMarler]

Hi all,

Wondering if anyone can assist me in attempting to run mobx-react or mobx-react-lite without a react-dom/react-native dependency. It appears that this was once a thing: mobxjs/mobx-react#42

I'm attempting to use mobx-react/mobx-react-lite with a custom renderer: https://github.com/nick-thompson/blueprint

I'd like to achieve what the mobx-react/custom import appears to have once provided. Is there a canonical way to achieve this now? It appears this was removed from the docs in v6.

v5 still references this: https://github.com/mobxjs/mobx-react/tree/v5

// - or, for custom renderers without DOM: -
import { observer } from "mobx-react/custom"

Any help much appreciated. Limited JS experience so apologies if I've missed anything glaringly obvious!

[JoshMarler]

Using a direct import { observer } from "mobx-react-lite/lib/observer" allows me to work around this but obviously I would prefer not to do so.

[will-stone]

I've found TS doesn't correctly find the types if importing from lib and so casting is required. I created a observer.ts file with:

import { observer as distObserver } from 'mobx-react-lite/dist/observer'
// @ts-expect-error workaround as mobx-react is expecting react-dom
import { observer as libraryObserver } from 'mobx-react-lite/lib/observer'

type Observer = typeof distObserver

export const observer: Observer = libraryObserver

[JoshMarler]

Yeah I've also hit this. In some ways it's a shame it's not an officially supported thing anymore. I worry consuming a lib like this (relying somewhat on internal details) could be asking for trouble down the line.

Thanks for the tip though @will-stone, I'll drop this into my project. Be nice to get proper types here.

[danielkcz]

Yeah well, we dropped it a long time ago and nobody really asked for it since then. Is it really that bad to have the import as you outlined?

If the observer is the only thing you need, you can make yourself an aliasing module that would reexport it so you don't need to have that longer path.

[JoshMarler]

Awesome thanks for the answer @FredyC !

Makes sense. No it's not that bad at all! I'm not JS literate enough to know how an alias module works but I shall discover. I'm pretty sure observer is all we'll use. Thanks for clarifying. I believe I can do a separate thing to import the types for observer in TS etc. I'll have a read.

Much appreciated