I want to make sure that my native library works on 0.6x React Native. I've got a version of the library working on 0.59.x but when I run it on 0.6x I get the following json response (together with server 500):
Body:
{"originModulePath":"screens/custom-action-screen.js","targetModuleName":"NativeModules","message":"Unable to resolve module `NativeModules` from `screens/custom-action-screen.js`: NativeModules could not be found within the project.\n\nIf you are sure the module exists, try these steps:\n 1. Clear watchman watches: watchman watch-del-all\n 2. Delete node_modules: rm -rf node_modules and run yarn install\n 3. Reset Metro's cache: yarn start --reset-cache\n 4. Remove the cache: rm -rf /tmp/metro-*","errors":[{"description":"Unable to resolve module `NativeModules` from `screens/custom-action-screen.js`: NativeModules could not be found within the project.\n\nIf you are sure the module exists, try these steps:\n 1. Clear watchman watches: watchman watch-del-all\n 2. Delete node_modules: rm -rf node_modules and run yarn install\n 3. Reset Metro's cache: yarn start --reset-cache\n 4. Remove the cache: rm -rf /tmp/metro-*"}],"name":"Error","stack":"Error: Unable to resolve module `NativeModules` from `screens/custom-action-screen.js`: NativeModules could not be found within the project.\n\nIf you are sure the module exists, try these steps:\n 1. Clear watchman watches: watchman watch-del-all\n 2. Delete node_modules: rm -rf node_modules and run yarn install\n 3. Reset Metro's cache: yarn start --reset-cache\n 4. Remove the cache: rm -rf /tmp/metro-*\n at ModuleResolver.resolveDependency (/Users/krzysztofkubicki/Workspace/PublicRelease/React-Native-Dev/SampleApp/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:186:15)\n at ResolutionRequest.resolveDependency (/Users/krzysztofkubicki/Workspace/PublicRelease/React-Native-Dev/SampleApp/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)\n at DependencyGraph.resolveDependency (/Users/krzysztofkubicki/Workspace/PublicRelease/React-Native-Dev/SampleApp/node_modules/metro/src/node-haste/DependencyGraph.js:282:16)\n at Object.resolve (/Users/krzysztofkubicki/Workspace/PublicRelease/React-Native-Dev/SampleApp/node_modules/metro/src/lib/transformHelpers.js:267:42)\n at /Users/krzysztofkubicki/Workspace/PublicRelease/React-Native-Dev/SampleApp/node_modules/metro/src/DeltaBundler/traverseDependencies.js:426:31\n at Array.map (<anonymous>)\n at resolveDependencies (/Users/krzysztofkubicki/Workspace/PublicRelease/React-Native-Dev/SampleApp/node_modules/metro/src/DeltaBundler/traverseDependencies.js:423:18)\n at /Users/krzysztofkubicki/Workspace/PublicRelease/React-Native-Dev/SampleApp/node_modules/metro/src/DeltaBundler/traverseDependencies.js:275:33\n at Generator.next (<anonymous>)\n at asyncGeneratorStep (/Users/krzysztofkubicki/Workspace/PublicRelease/React-Native-Dev/SampleApp/node_modules/metro/src/DeltaBundler/traverseDependencies.js:87:24)"}
So my quetion is: How is it possible that the NativeModules were "visible" in previous version? All I did was upgrade the react native version and left all the code as it was.
It still works on 0.59.
I try to create a tab navigation in react native. But when I want to import import { createBottomTabNavigator } from 'react-navigation-tabs';. I have the following error : bundling failed: Error: Unable to resolve module `react-navigation-tabs` from `/Users/nicolasthibault/Desktop/RunApplication/Runenger/Views/NavigationReact.js`: Module `react-navigation-tabs` does not exist in the Haste module map.
I tried many commands that I found to similar topic but any of them works in my situation.
For example, I tried these ones but it doesn't solve my problem.
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-*`.
Thanks for your help.
Install react-navigation-tabs:
yarn add react-navigation-tabs
Or
npm install react-navigation-tabs
Then run metro:
react-native start --reset-cache
Also make sure you've followed the instructions here: https://reactnavigation.org/docs/en/getting-started.html
1) Install 'react-navigation-tabs' using either npm or yarn
2) Build your project using npm start --reset-cache, If you are using expo use expo r -c
It'll work.
When creating a new react native project using the standard react-native init MyApp and running react-native run-ios for the first time I'm seeing the following error
error: bundling failed: Error: Unable to resolve module `#babel/runtime/helpers/interopRequireDefault` from `/Users/chrisedgington/Development/ReactNative/SixNationsPredictor/index.js`: Module `#babel/runtime/helpers/interopRequireDefault` does not exist in the Haste module map
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/chrisedgington/Development/ReactNative/MyApp/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:209:1301)
at ResolutionRequest.resolveDependency (/Users/chrisedgington/Development/ReactNative/MyApp/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:83:16)
at DependencyGraph.resolveDependency (/Users/chrisedgington/Development/ReactNative/MyApp/node_modules/metro/src/node-haste/DependencyGraph.js:238:485)
at Object.resolve (/Users/chrisedgington/Development/ReactNative/MyApp/node_modules/metro/src/lib/transformHelpers.js:180:25)
at dependencies.map.result (/Users/chrisedgington/Development/ReactNative/MyApp/node_modules/metro/src/DeltaBundler/traverseDependencies.js:311:29)
at Array.map (<anonymous>)
at resolveDependencies (/Users/chrisedgington/Development/ReactNative/MyApp/node_modules/metro/src/DeltaBundler/traverseDependencies.js:307:16)
at /Users/chrisedgington/Development/ReactNative/MyApp/node_modules/metro/src/DeltaBundler/traverseDependencies.js:164:33
at Generator.next (<anonymous>)
at step (/Users/chrisedgington/Development/ReactNative/MyApp/node_modules/metro/src/DeltaBundler/traverseDependencies.js:266:307)
I've tried running the suggested but still see the same issue. I've seen a few posts about similar issues but nothing specifically seems to say how to resolve the problem in react-native.
macOS: 10.13.6
node: 8.11.3
react-native-cli: 2.0.1
react-native: 0.57.1
Have a go and try:
npm add #babel/runtime
Or upgrade babel runtime:
"#babel/runtime": "7.0.0-beta.55"
I tried all the things mentioned above, and, I found myself here again tonight.
Running from a nrwl mono repo, I had to cd into the app that was having the problem and run.
jest --clearCache
You should first quit the metro terminal before executing
npm add #babel/runtime
npm install
You should add and install babel for your projects
npm add #babel/runtime
npm install
If The error is not fixed, Try:
npm start --reset-cache
The issue for me was that #babel/runtime was installed as a dev-dependency instead of just a normal (non-dev) dependency
Try to update your npm version first
npm update -g npm#version or sudo npm -gf update npm#version
and then just add the babel runtime at your react native project
npm add #babel/runtime
Try upgrading your packages. You could have an old package causing the problem:
yarn upgrade-interactive --latest
Current error message suggests these steps to fix this:
Clear watchman watches: watchman watch-del-all
Delete node_modules: rm -rf node_modules and run yarn install
Reset Metro's cache: yarn start --reset-cache
Remove the cache: rm -rf /tmp/metro-*
The last one solved it for me.
I had this problem today (April 2021), and I could solve it only by removing the webpack-node-externals package from my webpack configuration.
For me the solution was (Mac):
Stop IntelliJ
Enter terminal
Run: npx browserslist#latest --update-db -g
Run: npm cache verify
Start IntelliJ
If still not working:
Delete node_modules fron project if exists
Run: npm cache verify
Run npm install -f in project
Run: npx browserslist#latest --update-db -g
Problem:
I was in the middle of upgrading flow to typescript and I used #khanacademy/flow-to-ts to convert js files to ts. the lib not only changed the js files of the app but also it converted all js files in node_modules directory.
Solution:
I had to remove the node_modules and npm -i. This time when I checked the node_modules the interopRequireDefault.js file was there.
In case you are working with Yarn workspaces please note you are running react-native start from the right project...
Install latest Babel/runtime
=> install #babel/runtime
After that clean or reset the cache
=> npm start -- --reset-cache after
or
npm cache clean --force
I accidentally deleted my node_modules and package-lock.json. I used npm i to regenerate them and suddenly I was getting the above error. I solved it in two ways.
By uninstalling the app and using the following commands.
npx jest --clearCache
npm update
npm i
npx react-native run-android
By deleting the local repository and re-cloning it.
Hope this helps you.
I just uninstalled watchman. It worked for me.
brew uninstall watchman
Someone may find this helpful. I had the same problem while using turborepo and Expo.
Resolved it by adding 'node-linker=hoisted' to .npmrc.
Had this issue none of the above listed solutions worked for me, I had to go to node_modules/jest-haste-map/build/index.js
changed const crawl = canUseWatchman && this._options.useWatchman ? _watchman.default : _node.default;
to const crawl = canUseWatchman && this._options.useWatchman ? _node.default : _node.default;
The application is installed in the emulator. But it is not starting. Emulator points me out this error.
At the same time server gives following errors.
error: bundling failed: TypeError: Cannot read property
'throwIfClosureRequired' of undefined (While processing preset:
"C:\Users\sajithk\UTransP\node_modules\babel-preset-react-native\index.js")
at _default (C:\Users\sajithk\UTransP\node_modules\babel-preset-react-native\node_modules\#babel\plugin-transform-block-scoping\lib\index.js:19:36)
at Function.memoisePluginContainer (C:\Users\sajithk\UTransP\node_modules\babel-core\lib\transformation\file\options\option-manager.js:113:13)
at Function.normalisePlugin (C:\Users\sajithk\UTransP\node_modules\babel-core\lib\transformation\file\options\option-manager.js:146:32)
at C:\Users\sajithk\UTransP\node_modules\babel-core\lib\transformation\file\options\option-manager.js:184:30
at Array.map ()
at Function.normalisePlugins (C:\Users\sajithk\UTransP\node_modules\babel-core\lib\transformation\file\options\option-manager.js:158:20)
at OptionManager.mergeOptions (C:\Users\sajithk\UTransP\node_modules\babel-core\lib\transformation\file\options\option-manager.js:234:36)
at C:\Users\sajithk\UTransP\node_modules\babel-core\lib\transformation\file\options\option-manager.js:265:14
at C:\Users\sajithk\UTransP\node_modules\babel-core\lib\transformation\file\options\option-manager.js:323:22
BUNDLE [android, dev] ./index.js ░░░░░░░░░░░░░░░░ 0.0% (0/1), failed.
This is the first time i ran the application in the emulator after creating the project.
I had the same problem and in my case I solved it by changing the babel-preset-react-native version from 5.0.0 to 4.0.0
And follow the instructions:
Clear watchman watches: watchman watch-del-all.
Delete the node_modules folder: rm -rf node_modules && npm install.
Reset Metro Bundler cache: rm -rf /tmp/metro-bundler-cache-* or npm start -- --reset-cache.
Remove haste cache: rm -rf /tmp/haste-map-react-native-packager-*.
What's your babel-preset-react-native version?
Try this command:
npm install --save babel-preset-react-native#2.1.0
in console: npx react-native start
npm install react-navigation --save
I used the above fixed my issue, if anyone have same issue, just try.
if anyone know why this command can fix the issue, I am happy to learn.
Cheers
error: bundling failed: "Unable to resolve module `ReactNative` from `C:\\AnchorDev\\Anchor\\node_modules\\react-native\\Libraries\\react-native\\react-native-implementation.js`: Module does not exist in the 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 packager cache: `rm -fr $TMPDIR/react-*` or `npm start -- --reset-cache`."
This is the error that I received after upgrading React Native from 0.45.1 to 0.46.4. I ran npm i but I still get the error. How do I resolve it?
Try deleting node_modules folder and install packages again with npm install