React Native build Error (AccessibilityInfo does not Exist) - react-native

Loading dependency graph, done.
error: bundling failed: Error: Unable to resolve module AccessibilityInfo from E:\react-apps\Whatsapp\node_modules\react-native\Libraries\react-native\react-native-implementation.js: Module AccessibilityInfo does not exist in the Haste module map

As you have react-native version "0.44.0" and react with version "16.3.1", as per the document you must have correct versions dependencies. Please upgrade your react native version.
Please refer this link for more details https://github.com/react-community/create-react-native-app/blob/master/VERSIONS.md
remove node_modules folder from your project. Also use below commands:
npm prune
npm cache clear
npm cache clean --force
npm start -- --reset-cache
npm i

Related

React Native- Expo Something went wrong in downloading and extracting the project files: NPM package not found:

I have started many react native applications with the following code before, but now I am encountering this error (Something went wrong in downloading and extracting the project files: NPM package not found: https://registry.npmjs.org/expo-template-blank/-/expo-template-blank-47.0.19.tgz
Error cloning template: Error: NPM package not found: https://registry.npmjs.org/expo-template-blank/-/expo-template-blank-47.0.19.tgz).
Can anyone figure out why?
Error
Try this
npm uninstall -g expo-cli
and npm start again.

#walletconnect/client throw Error: While trying to resolve module crypto

I am using https://reactnative.dev/docs/environment-setup 0.64
I npm install #walletconnect/client
put below import in App.js
import WalletConnect from "#walletconnect/client";
after npx react-native run-ios and got below error:
error: Error: While trying to resolve module `crypto` from file `/Users/hahaha/workspace/mobile/reactnative/nonft/node_modules/#pedrouid/iso-crypto/dist/cjs/helpers/env/node.js`, the package `/Users/hahaha/workspace/mobile/reactnative/nonft/node_modules/crypto/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`/Users/hahaha/workspace/mobile/reactnative/nonft/node_modules/crypto/index.js`. Indeed, none of these files exist:
I tried to remove node_modules folder and npm install again but still get the same error.
I am sure that it is thrown by #walletconnect/client because when I removed
import WalletConnect from "#walletconnect/client";
then the error gone
crypto is a built in Node module, which isn't available in React Native, as iOS/Android apps don't run with a Node runtime - only web apps do.
There are a few ways to solve this problem, all of them fairly hacky.
One way is to replace the crypto module with a React Native native module that does the same thing. React-native-crypto is the package used by create-react-native-dapp (https://www.npmjs.com/package/create-react-native-dapp) to integrate with WalletConnect: https://www.npmjs.com/package/react-native-crypto
To get this integration working, note that you'll need to be able to link modules and run rn-nodeify, as it mentions in the instructions on that npm package:
npm i --save react-native-crypto
# install peer deps
npm i --save react-native-randombytes
react-native link react-native-randombytes
# install latest rn-nodeify
npm i --save-dev tradle/rn-nodeify
# install node core shims and recursively hack package.json files
# in ./node_modules to add/update the "browser"/"react-native" field with relevant mappings
./node_modules/.bin/rn-nodeify --hack --install
If you're using Expo, note that you'll need to eject Expo before this can work.
Another hacky workaround is to run WalletConnect in a WebView using react-native-webview. There's an old but working example of this that you can just use to plug and play WalletConnect without requiring linking that you can get here: https://github.com/cawfree/react-native-walletconnect
Note that that repo is archived and effectively hardcoded to WalletConnect version 1.0.0, but it's a pretty simple codebase - you can just effectively copy and paste its code and update it to the latest version of WalletConnect to get it working with a later version if desired.
As a final note, there are multiple ways to get node modules running in React Native on top of rn-nodeify. If you'd like to explore other methods of getting node modules running, here's a quick rundown of other possibilities: https://gist.github.com/parshap/e3063d9bf6058041b34b26b7166fd6bd

React native compile error on resolving module

I can't compile my project because of this error.
Unable to resolve module #react-navigation/core from
node_modules\#react-navigation\native\src\createAppContainer.js:
When I run I encounter with this problem. Can anybody help me?
Sometimes such error occurs as the package-json.lock file which locks the version.
So do 1 thing remove the version of #react-navigation and all related dependencies from your package.json and after that do following once again
npm install #react-navigation/native --save
npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context #react-native-community/masked-view --save
Must help!
This error means that either you haven't installed the react-navigation module or that you have installed the module but didn't re-built your project using react-native run-android or react-native run-ios.
Following these steps should solve your issue:
Install react-navigation module.
Re-build your project.
Restart the packager by stopping the current packager and then
starting the packager again
with react-native start.

Unable to resolve module crypto in reactnative

I have posted this here have created react-native app using
react-native init myapp
added web3 in package.json
npm install
react-native run-ios
but i am getting the error unable to resolve module crypto from web3-eth-accounts. Is there any way to fix this
unable to resolve crypto
Crypto is a node js module, when React Native is run - it uses Javascript Core. Crypto isn't include within this. When I installed crypto I used the following package:
https://www.npmjs.com/package/react-native-crypto
Instructions:
npm i --save react-native-crypto
# install peer deps
npm i --save react-native-randombytes
react-native link react-native-randombytes
# install latest rn-nodeify
npm i --save-dev tradle/rn-nodeify
# install node core shims and recursively hack package.json files
# in ./node_modules to add/update the "browser"/"react-native" field with relevant mappings
./node_modules/.bin/rn-nodeify --hack --install
rn-nodeify will create a shim.js in the project root directory
// index.ios.js or index.android.js
// make sure you use `import` and not require!
import './shim.js'
// ...the rest of your code
Import shim.js in your index.js file.
When you have done that crypto should be made available, if it still doesn't work I had to create a const in my App.js file like so:
export const cryp = require('crypto');
And import it into the components you need.
UPDATE
I've done a fresh build for this, I followed the below:
react-native init TestApp
Follow the instructions above for Crypto.
Linked:
react-native link
react-native run-ios
react-native-crypto don't work on recent react-native version 0.63.3 and react version 16.13.1, any more.
I used crypto-js package. The version is 3.1.9-1 in my react-native app. It's working well.
You can add below line in package.json file.
"crypto-js": "3.1.9-1",
crypto is a node's library that works with the browser however we can use it with react native with some hacks mentioned below follow these steps and boom! you are ready to rock.
npm i --save react-native-crypto
==> install peer deps
npm i --save react-native-randombytes
react-native link react-native-randombytes
==>install latest rn-nodeify
npm i --save-dev tradle/rn-nodeify
==> install node core shims and recursively hack package.json files
==> in ./node_modules to add/update the "browser"/"react-native" fieldwith relevant mappings
./node_modules/.bin/rn-nodeify --hack --install
i had the same problem, it seems the crypto module is not supported by react native because when i install crytpo , it does not have an index.js file in the node_modules. so my problem came about when i was trying to use jsonwebtoken which uses crypto to encrypt data. so i uninstalled jsonwebtoken and switched to react-native-pure-jwt

React Native: bundling failed - Unable to resolve module `AccessibilityInfo`

error: bundling failed:
Error: Unable to resolve module AccessibilityInfo from D:\MyApp\node_modules\react-native\Libraries\react-native\react-native-implementation.js: Module AccessibilityInfo does not exist in the Haste module map
Its some incompatible versioning problems in React native.Try this it will work
Change versions of following in package.json
In dependencies :-
"react": "16.3.1"
"react-native": "0.55.4"
In devDependencies :-
"babel-preset-react-native": "2.1.0"
Delete node_modules and run npm install --save
Then run application by react-native run-android
It will run fine ...
Heading
first of all try with
npm start -- --reset-cache
If this is not working
than delete node modules & npm install
npm start -- --reset-cache