Hi so I'm trying to create an android app within react-native within the app i'm trying to use react-navigation and i get the following error when i run the program with npx react-native run-android
error: Error: Unable to resolve module `#react-navigation/stack` from `src\nav\nav.js`: #react-navigation/stack could not be found within the project.
If you are sure the module exists, try these steps:
1. Clear watchman watches: watchman watch-del-all
2. Delete node_modules: rm -rf node_modules and run yarn install
3. Reset Metro's cache: yarn start --reset-cache
4. Remove the cache: rm -rf /tmp/metro-*
at ModuleResolver.resolveDependency (C:\Users\Ike\Desktop\Again\project\Project\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:186:15)
at ResolutionRequest.resolveDependency (C:\Users\Ike\Desktop\Again\project\Project\node_modules\metro\src\node-haste\DependencyGraph\ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (C:\Users\Ike\Desktop\Again\project\Project\node_modules\metro\src\node-haste\DependencyGraph.js:287:16)
at Object.resolve (C:\Users\Ike\Desktop\Again\project\Project\node_modules\metro\src\lib\transformHelpers.js:267:42)
at C:\Users\Ike\Desktop\Again\project\Project\node_modules\metro\src\DeltaBundler\traverseDependencies.js:434:31
at Array.map (<anonymous>)
at resolveDependencies (C:\Users\Ike\Desktop\Again\project\Project\node_modules\metro\src\DeltaBundler\traverseDependencies.js:431:18)
at C:\Users\Ike\Desktop\Again\project\Project\node_modules\metro\src\DeltaBundler\traverseDependencies.js:275:33
at Generator.next (<anonymous>)
at asyncGeneratorStep (C:\Users\Ike\Desktop\Again\project\Project\node_modules\metro\src\DeltaBundler\traverseDependencies.js:87:24)
I've tried many things including using yarn instead of npm when trying to build the program. I've also tried deleted node_modules and removing react-navigation from packages.json and even npm install --save react-navigation
Do you also have all the dependencies installed? react-native-gesture-handler, react-native-reanimated, react-native-screens and react-native-safe-area-context and #react-native-community/masked-view
I tried to re install react package but still did not fix it
Error: Cannot find module './launchEditor'
Doing a "fresh" install will work with Yarn or npm:
rm -rf node_modules package-lock.json
npm install
I am getting an error when I am running my application:
error: Error: Unable to resolve module `#react-native-community/art` from `node_modules/react-native-pie/src/Pie.js`: #react-native-community/art could not be found within the project.
If you are sure the module exists, try these steps:
1. Clear watchman watches: watchman watch-del-all
2. Delete node_modules: rm -rf node_modules and run yarn install
3. Reset Metro's cache: yarn start --reset-cache
4. Remove the cache: rm -rf /tmp/metro-*
at ModuleResolver.resolveDependency (/Users/mayankbudhiraja/Desktop/appcorona/node_modules/#react-native-community/cli/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:186:15)
at ResolutionRequest.resolveDependency (/Users/mayankbudhiraja/Desktop/appcorona/node_modules/#react-native-community/cli/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (/Users/mayankbudhiraja/Desktop/appcorona/node_modules/#react-native-community/cli/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
at Object.resolve (/Users/mayankbudhiraja/Desktop/appcorona/node_modules/#react-native-community/cli/node_modules/metro/src/lib/transformHelpers.js:267:42)
at /Users/mayankbudhiraja/Desktop/appcorona/node_modules/#react-native-community/cli/node_modules/metro/src/DeltaBundler/traverseDependencies.js:434:31
at Array.map (<anonymous>)
at resolveDependencies (/Users/mayankbudhiraja/Desktop/appcorona/node_modules/#react-native-community/cli/node_modules/metro/src/DeltaBundler/traverseDependencies.js:431:18)
at /Users/mayankbudhiraja/Desktop/appcorona/node_modules/#react-native-community/cli/node_modules/metro/src/DeltaBundler/traverseDependencies.js:275:33
at Generator.next (<anonymous>)
at asyncGeneratorStep (/Users/mayankbudhiraja/Desktop/appcorona/node_modules/#react-native-community/cli/node_modules/metro/src/DeltaBundler/traverseDependencies.js:87:24)
What I did to correct the error?
I tried running the above mentioned steps (didn't worked)
Tried reinstalling the Pie Chart (didn't worked)
Deleted entire node_modules (didn't worked)
Can you please help me with the issue?
For react-native-pie >= 1.1.0 install peer dependency
NPM
npm i --save #react-native-community/art
OR
Yarn
yarn add #react-native-community/art
This question already has answers here:
Unable to resolve module `#babel/runtime/helpers/interopRequireDefault`
(17 answers)
Closed 4 years ago.
I want to build project with Native Code in React Native, but have a problem.
I used official docs on https://facebook.github.io/react-native/docs/getting-started.html, but after react-native run-android i get an error
1
Can you help me?
The development server returned response error code: 500
URL: http://10.0.2.2:8081/index.delta?platform=android&dev=true&minify=false
Body:
{"originModulePath":"D:\\Develop_Drafts\\projectname\\index.js","targetModuleName":"#babel/runtime/helpers/interopRequireDefault","message":"Unable to resolve module `#babel/runtime/helpers/interopRequireDefault` from `D:\\Develop_Drafts\\projectname\\index.js`: Module `#babel/runtime/helpers/interopRequireDefault` does not exist in the Haste module map\n\nThis might be related to https://github.com/facebook/react-native/issues/4968\nTo resolve try the following:\n 1. Clear watchman watches: `watchman watch-del-all`.\n 2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.\n 3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`.\n 4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.","errors":[{"description":"Unable to resolve module `#babel/runtime/helpers/interopRequireDefault` from `D:\\Develop_Drafts\\projectname\\index.js`: Module `#babel/runtime/helpers/interopRequireDefault` does not exist in the Haste module map\n\nThis might be related to https://github.com/facebook/react-native/issues/4968\nTo resolve try the following:\n 1. Clear watchman watches: `watchman watch-del-all`.\n 2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.\n 3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`.\n 4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`."}],"name":"Error","stack":"Error: Unable to resolve module `#babel/runtime/helpers/interopRequireDefault` from `D:\\Develop_Drafts\\projectname\\index.js`: Module `#babel/runtime/helpers/interopRequireDefault` does not exist in the Haste module map\n\nThis might be related to https://github.com/facebook/react-native/issues/4968\nTo resolve try the following:\n 1. Clear watchman watches: `watchman watch-del-all`.\n 2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.\n 3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`.\n 4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.\n at ModuleResolver.resolveDependency (D:\\Develop_Drafts\\projectname\\node_modules\\metro\\src\\node-haste\\DependencyGraph\\ModuleResolution.js:209:1301)\n at ResolutionRequest.resolveDependency (D:\\Develop_Drafts\\projectname\\node_modules\\metro\\src\\node-haste\\DependencyGraph\\ResolutionRequest.js:83:16)\n at DependencyGraph.resolveDependency (D:\\Develop_Drafts\\projectname\\node_modules\\metro\\src\\node-haste\\DependencyGraph.js:238:485)\n at Object.resolve (D:\\Develop_Drafts\\projectname\\node_modules\\metro\\src\\lib\\transformHelpers.js:180:25)\n at dependencies.map.result (D:\\Develop_Drafts\\projectname\\node_modules\\metro\\src\\DeltaBundler\\traverseDependencies.js:311:29)\n at Array.map (<anonymous>)\n at resolveDependencies (D:\\Develop_Drafts\\projectname\\node_modules\\metro\\src\\DeltaBundler\\traverseDependencies.js:307:16)\n at D:\\Develop_Drafts\\projectname\\node_modules\\metro\\src\\DeltaBundler\\traverseDependencies.js:164:33\n at Generator.next (<anonymous>)\n at step (D:\\Develop_Drafts\\projectname\\node_modules\\metro\\src\\DeltaBundler\\traverseDependencies.js:266:307)"}
processBundleResult
BundleDownloader.java:296
access$200
BundleDownloader.java:37
onResponse
BundleDownloader.java:174
execute
RealCall.java:153
run
NamedRunnable.java:32
runWorker
ThreadPoolExecutor.java:1162
run
ThreadPoolExecutor.java:636
run
Thread.java:764
enter image description here
Try this.
npm add #babel/runtime
npm install
I've seen few posts related to this type of error. But couldn't resolve in mine.
My package.json:
"react": "~0.14.7",
"webpack": "^1.12.13",
"react-hot-loader": "^3.0.0-beta.6",
.
.
I'm getting following error on webpack:
ERROR in ./public/src/main.js
Module not found: Error: Cannot resolve module 'react-dom' in C:\Users\react-example\public\src
# ./public/src/main.js 19:16-36
But in the cmd line when I did
npm -v react-dom
I get 3.10.10. react-dom is there. But I wonder why it still gives this error.
When I installed react-dom through npm "npm install react-dom", and run webpack I get following errors:
ERROR in ./~/react-dom/lib/ReactDOMNullInputValuePropHook.js
Module not found: Error: Cannot resolve 'file' or 'directory' C:\Users\react-example/node_modules/react/lib/ReactComponentTreeHook in C:\Users\react-example\node_modules\react-dom\lib
# ./~/react-dom/lib/ReactDOMNullInputValuePropHook.js 13:29-72
ERROR in ./~/react-dom/lib/ReactDOMUnknownPropertyHook.js
Module not found: Error: Cannot resolve 'file' or 'directory' C:\Users\react-example/node_modules/react/lib/ReactComponentTreeHook in C:\Users\react-example\node_modules\react-dom\lib
# ./~/react-dom/lib/ReactDOMUnknownPropertyHook.js 15:29-72
ERROR in ./~/react-dom/lib/ReactDOMInvalidARIAHook.js
Module not found: Error: Cannot resolve 'file' or 'directory' C:\Users\react-example/node_modules/react/lib/ReactComponentTreeHook in C:\Users\react-example\node_modules\react-dom\lib
# ./~/react-dom/lib/ReactDOMInvalidARIAHook.js 14:29-72
ERROR in ./~/react-dom/lib/ReactDebugTool.js
Module not found: Error: Cannot resolve 'file' or 'directory' C:\Users\react-example/node_modules/react/lib/ReactComponentTreeHook in C:\Users\react-example\node_modules\react-dom\lib
# ./~/react-dom/lib/ReactDebugTool.js 16:29-72
Please help.
Issue is react-dom is not installed, when you hit npm -v react-dom, it gives you the version of npm not react-dom version, you can check that by using npm -v or npm -v react-dom both will give you the same result.
You are checking the package version incorrectly.
How to install react and react-dom properly?
Use this to install react and react-dom:
npm install react react-dom --save
After that, you can check your package.json file, if react and react-dom has been installed correctly, you will find an entry for that.
How to check install package version?
To check all the locally installed packages version:
npm list
For globally installed packages, use -g also:
npm list -g
To check the version of any specific package, specify the package name also:
npm list PackageName
For Example =>
npm list react
npm list react-router
After installation your package.json will look like this:
{
"name": "***",
"version": "1.0.0",
"main": "***",
"scripts": {
....
},
"repository": {
....
},
"keywords": [],
"author": "",
"dependencies": {
....
"react": "^15.4.2", //react
"react-dom": "^15.4.2", //react-dom
....
},
"devDependencies": {
....
}
}
Latest version of react-dom is : 15.4.2
Reference: https://www.npmjs.com/package/react-dom
In my case I had an alias in my webpack.config.common.js:
resolve: {
extensions: ['.js', '.jsx'],
alias: {
'react-dom': '#hot-loader/react-dom',
},
},
I just removed this line:
'react-dom': '#hot-loader/react-dom',
and it was fixed.
I used 'npm update' and that solved my problem.
In my case, it was an alias I had in my webpack.conf, which was looking for #hot-loader/react-dom.
For anybody reading this that wasn't able to figure it out. I had the same issue which I ended up resolving by installing the "react-router" package which is simply running the following command
npm i react-router-dom --save for a browser app.
npm i react-router-native for a native app.
You may need to update react and react-dom. Despite react-dom actually being installed, I was having this issue on ^15.5.4 and it went away with ^16.8.6:
$ # update the react and react-dom modules
$ yarn add react react-dom
Ensure that the two version match exactly in package.json:
"react": "^16.8.6",
"react-dom": "^16.8.6",
Delete yarn.lock, node_modules, and yarn again.
rm -Rf yarn.lock node_modules && yarn
You can also try to solve this issue by updating your react react-dom module, try
npm install react#latest react-dom#latest.
Try rm -rf node_modules && yarn or rm -rf node_modules && npm install if you use npm instead of yarn.
My particular issue for getting this error:
ERROR in ./src/index.js Module not found: Error: Can't resolve
'eact-dom' in
'C:\Users\Jose\Desktop\woz-u-React\React-Course\react-lesson-one\src'
# ./src/index.js 2:0-32 # multi
(webpack)-dev-server/client?http://localhost:8080 ./src/index.js
To fix this issue, I had to unzip the folder before installing.
The following command will resolve the problem.
npm install react react-dom --save
For those using Parcel, this can occur if you are targeting Node for a browser-based app.
There are 3 ways Parcel will infer this from your package.json:
Remove node as the target, or specify the --target as browser at the command line.
Also see:
https://v2.parceljs.org/getting-started/migration/
https://v2.parceljs.org/configuration/package-json/
Your app is pointing to the global version of react hence you need install it manually using global keyword. You can also compare your installed version of react-dom in package.json of your current project and globally installed react-dom version using command npm -v react-dom if both are different then manually install react dom using command:
sudo npm install -g react-dom#17.0.2