React Native error 'Unable to resolve module `react-native` '


React Native error 'Unable to resolve module `react-native` '



I am attempting to learn React Native so I went ahead and followed all the steps in the Getting Started guide at the official documentation site. I have some experience with React so i wanted to expand on it.


React Native


React



I did wade in around 6 months ago for a simple 'hello world' app and everything worked fine for me on both the Android emulator and the IoS simulator. Did test on my device as well and had no issues. Since i got busy with other work i did not get back to it until now.



The error i get when i attempt the react-native run-android command:


react-native run-android


Metro Bundler ready.

Loading dependency graph, done.
error: bundling failed: Error: Unable to resolve module `react-native` from `/Users/arunmenon/Sites/reactnative/website/index.js`: Module `react-native` does not exist in the Haste module map or in these directories:
/Users/arunmenon/Sites/reactnative/website/node_modules

This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:
1. Clear watchman watches: `watchman watch-del-all`.
2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.
3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`. 4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.
at ModuleResolver.resolveDependency (/Users/arunmenon/Sites/reactnative/website/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:161:1460)
at ResolutionRequest.resolveDependency (/Users/arunmenon/Sites/reactnative/website/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:91:16)
at DependencyGraph.resolveDependency (/Users/arunmenon/Sites/reactnative/website/node_modules/metro/src/node-haste/DependencyGraph.js:272:4579)
at dependencies.map.relativePath (/Users/arunmenon/Sites/reactnative/website/node_modules/metro/src/DeltaBundler/traverseDependencies.js:376:19)
at Array.map (<anonymous>)
at resolveDependencies (/Users/arunmenon/Sites/reactnative/website/node_modules/metro/src/DeltaBundler/traverseDependencies.js:374:16)
at /Users/arunmenon/Sites/reactnative/website/node_modules/metro/src/DeltaBundler/traverseDependencies.js:212:33
at Generator.next (<anonymous>)
at step (/Users/arunmenon/Sites/reactnative/website/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:313)
at /Users/arunmenon/Sites/reactnative/website/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:473
BUNDLE [android, dev] ./index.js ░░░░░░░░░░░░░░░░ 0.0% (0/1), failed.



I tried all the suggested steps but the issue still persists. The error:


Error: Unable to resolve module `react-native` from `/Users/arunmenon/Sites/reactnative/website/index.js`:
Module `react-native` does not exist in the Haste module map or in these directories:
/Users/arunmenon/Sites/reactnative/website/node_modules



suggests that it looks like somehow there is some issue with picking up the path from node_modules. The first line in index.js is import { AppRegistry } from 'react-native'; and thats where the error is thrown.


node_modules


import { AppRegistry } from 'react-native';



The paths mentioned are valid and i do have react-native installed in the node_modules directory in the path.



I am developing on a Mac and the targeted device currently is Android. I am going the react-native CLI command route and not the create-react-native-app route.


react-native


create-react-native-app



I have Android Studio 3.1.3 (updated last night), Node 8.11.2, NPM 6.1.0, Watchman 4.9.0 (installed via Homebrew), Java JDK 1.8.0_144.



I followed the getting started guid to a T. Since i got t working earlier - around 6 months ago - i wonder why i get this now. I have the same Android Studio version as then(i updated Android Studio yesterday to rule out issues with having an older version. I get the same error with the new version as well) The difference between then and now:



Everything else is the same. I tried a couple of fresh install as well - starting over from the beginning i.e but it didnt work.



My package.json:


{
"name": "website",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "16.3.1",
"react-native": "0.55.4"
},
"devDependencies": {
"babel-jest": "23.2.0",
"babel-preset-react-native": "4.0.0",
"jest": "23.2.0",
"react-test-renderer": "16.3.1"
},
"jest": {
"preset": "react-native"
}
}




1 Answer
1



Please remove all react-native specific folders from "%appdata%Temp" and then try below commands:



cd android
gradlew clean
cd.. and remove the node_modules folder
npm cache clean --force
npm install
npm start -- --reset-cache
react-native run-android





Thanks for the comments. The equivalent to a temp folder in Mac is Library/cache and the $TMPDIR as mentioned here: apple.stackexchange.com/a/131080. The first location had no react-native related directories but i found a few react references in yarn and typescript directories. I removed these directories. In the $TMPDIR structure there are no direct react-native references. I did find a hatsmap reference and a metro directory which i have removed. I am not sure which android directory you mean in cd android. Is it the sdk directory?
– arunmenon
Jun 30 at 5:51


Library/cache


$TMPDIR


yarn


typescript


$TMPDIR


hatsmap


metro


cd android





I also don't have the gradlew command available, at least when using via the terminal/prompt. I get -bash: gradlew: command not found. Should all this be done within Android Studio? I don't use Android Studio for development. I use Visual Studio Code alongwith either its inbuilt terminal or the globally available terminal for node/npm commands
– arunmenon
Jun 30 at 5:59


gradlew


-bash: gradlew: command not found





All these commands are windows specific. There will be android folder in your project directory, go to that folder and open command prompt and run gradlew clean command there. That's it.
– Sandip Lipane
Jun 30 at 6:12





@arunmenon, yes you can use inbuilt or global terminal for running these commands. And for gradlew command, you have to be in android folder of your project, hope it will help you. Let me know if any issue
– Sandip Lipane
Jun 30 at 6:34






Ive managed to get it going at last. While i cannot exactly pinpoint which of the several actions i took worked - i tried various options over the weekend - what needs to go to the checklist is to try a new fresh install in a different directory. Deleting the project directory and re-creating it with the same name didn't work. A new directory name would be required. One good thing thats come out is that i seem to be somewhat nativescript. dev ready as well. Thanks for the answer - a am accepting this as the correct answer since the answer has valid steps.
– arunmenon
yesterday






By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Comments

Post a Comment

Popular posts from this blog

paramiko-expect timeout is happening after executing the command

paramiko-expect timeout is happening after executing the command Can someone help me why timeout is happening after executing the command .I am trying to SSH to a machine and execute a command.I want to store the result of the executed command . I have referred paramiko-timeout but i didn't get my expected result. import traceback try: import paramiko except ImportError: raise Exception("Please install paramiko , pip install paramiko") import pexpect from paramiko_expect import SSHClientInteraction def main(): HOSTNAME = "minion5.net" USERNAME = "root" PASSWORD = "help@432" PROMPT = "root@*:~$s+" try: client = paramiko.SSHClient() client.load_system_host_keys() client.set_missing_host_key_policy(paramiko.AutoAddPolicy()) client.connect(hostname=HOSTNAME, username=USERNAME, password=PASSWORD) with SSHClientInteraction(client, timeout=20, display=True) as interact:
Read more

how to run turtle graphics in Colaboratory

how to run turtle graphics in Colaboratory Given that we can do other types of drawing/visualization in Colaboratory, I would think running turtle graphics would be pretty simple (but not so simple I've figured it out!) I can import the turtle library, but I get the following error when any draw command occurs: TclError: no display name and no $DISPLAY environment variable Thanks in advance. 1 Answer 1 I think P5.js is your best bet. I test it in this notebook. https://colab.research.google.com/drive/1TqF6RObllyslad3KrO4SiAuegRjuJDCF By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
Read more

Export result set on Dbeaver to CSV

Export result set on Dbeaver to CSV Normally I use Dbeaver for windows and always export my result set like this: run my query --> select the result --> export the result set --> select export to clipboard --> done This step by step puts my result set in my clipboard and I can paste it wherever I want to work with it. The problem is that now I am using dbeaver for mac and this guide is not working. I can go on until the moment that I select my result set like in the image below: exporting data set But once I go further in the process, in the last step I get: no query Note that in "source" it was suppose to show the query that originated the result set, but instead it says just "select. As a result it does't select my result or anything (besides being "successful"). Normally my query would show up there automatically and I couldn't find any option that corrects this problem in the menus. Please help me! Thanks. Aft
Read more