react-dom could not be found within the project

[shivanshrajpoot]

Intended outcome

App Should Compile

Actual outcome

error: Error: Unable to resolve module react-dom from node_modules/mobx-react/dist/mobxreact.esm.js: react-dom could not be found within the project.

How to reproduce the issue

1. Create an app using latest version of react-native
2. Follow instructions to setup mobx from official docs.

Versions

package.json

{ "name": "appName", "version": "0.0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios", "start": "react-native start", "test": "jest", "lint": "eslint . --ext .js,.jsx,.ts,.tsx" }, "dependencies": { "@react-native-community/masked-view": "^0.1.6", "@react-navigation/native": "^5.0.8", "@react-navigation/stack": "^5.1.0", "appcenter": "3.0.0", "appcenter-analytics": "3.0.0", "appcenter-crashes": "3.0.0", "mobx": "^5.15.4", "mobx-react": "^6.2.0", "react": "16.11.0", "react-native": "0.62.1", "react-native-animatable": "^1.3.3", "react-native-app-auth": "^5.1.0", "react-native-code-push": "^6.2.0", "react-native-gesture-handler": "^1.6.0", "react-native-google-signin": "^2.1.1", "react-native-magnus": "^1.0.32", "react-native-modal": "^11.5.6", "react-native-reanimated": "^1.7.0", "react-native-safe-area-context": "^0.7.3", "react-native-screens": "^2.2.0", "react-native-vector-icons": "^6.6.0", "yup": "^0.28.1" }, "devDependencies": { "@babel/core": "^7.6.2", "@babel/plugin-proposal-decorators": "^7.8.3", "@babel/runtime": "^7.6.2", "@react-native-community/eslint-config": "^1.0.0", "@types/jest": "^24.0.24", "@types/react-native": "^0.62.0", "@types/react-test-renderer": "16.9.2", "@typescript-eslint/eslint-plugin": "^2.25.0", "@typescript-eslint/parser": "^2.25.0", "babel-jest": "^24.9.0", "babel-plugin-module-resolver": "^4.0.0", "eslint": "^6.5.1", "jest": "^24.9.0", "metro-react-native-babel-preset": "^0.58.0", "prettier": "^2.0.2", "react-dom": "^16.13.1", "react-test-renderer": "16.11.0", "typescript": "^3.8.3" }, "jest": { "preset": "react-native", "moduleFileExtensions": [ "ts", "tsx", "js", "jsx", "json", "node" ] } }

[RanderGabriel]

I'm facing the same issue

[evelant]

Also here after upgrading my react-native project to 0.62

[shivanshrajpoot]

I temporarily resolved it by using react-dom as dev dependency, but obviously it's not the right way.

npm i --save-dev react-dom

[evelant]

I downgraded to

"mobx-react": "=6.1.7",

and its OK now

[RanderGabriel]

I'm facing it using react-native version 0.61.1. I realized that is stopped working on the last week. We didn't change any dependency related to mobx-react but our CI builds stopped working. We are using

"mobx-react": "^6.1.1",

When we clean the build cache (deleting /node_modules) in a development machine the problem appears.

[danielkcz]

I apologize for the issues, small oversight from yesterday's release. Please upgrade to 6.2.1 and mind following instructions in https://github.com/mobxjs/mobx-react#observer-batching

[evelant]

@FredyC Upgrading to 6.2.1 and adding observer batching seems to have fixed the react-dom issue, but may have introduced another.

Since upgrading I now sometimes have crashes with

TypeError: Object.defineProperty() called on non-object
   at defineProperty (native)
    at setHiddenProp (mobx-react)

Removing the import for observer batching stops this from happening. I can't reproduce it reliably. This is on react-native 0.62.1, mobx-react 6.2.1, mobx 5.15.4, mobx-state-tree 3.15.0

[danielkcz]

@AndrewMorsillo Please open a new issue and try to reproduce with React as I cannot imagine how React Native could be problematic in that sense.

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs or questions.