Ethereum React Native Boilerplate Questions

happyeric77 · January 10, 2022, 11:31am

When I try to use

import Moralis from "moralis/react-native";
Moralis.setAsyncStorage(AsyncStorage)

It brings me the error:

The provided value 'ms-stream' is not a valid 'responseType'.
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:189:6 in set__responseType
at node_modules/stream-http/lib/capability.js:36:5 in checkTypeSupport
at node_modules/stream-http/lib/capability.js:48:53 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/lib/request.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/index.js:1:27 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/xml-http-request.js:21:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/index.js:6:16 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-providers-http/lib/index.js:25:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core-requestmanager/lib/index.js:45:25 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core/lib/index.js:22:30 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3/lib/index.js:29:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/MoralisWeb3.js:55:41 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/ParseUser.js:51:48 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/ParseACL.js:25:47 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/decode.js:19:46 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/Parse.js:31:44 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/index.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at AppProviders.tsx:11:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at index.js:6:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/metro-runtime/src/polyfills/require.js:201:44 in guardedLoadModule
- ... 2 more stack frames from framework internals

The provided value 'moz-chunked-arraybuffer' is not a valid 'responseType'.
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:189:6 in set__responseType
at node_modules/stream-http/lib/capability.js:36:5 in checkTypeSupport
at node_modules/stream-http/lib/capability.js:49:66 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/lib/request.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/index.js:1:27 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/xml-http-request.js:21:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/index.js:6:16 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-providers-http/lib/index.js:25:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core-requestmanager/lib/index.js:45:25 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core/lib/index.js:22:30 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3/lib/index.js:29:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/MoralisWeb3.js:55:41 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/ParseUser.js:51:48 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/ParseACL.js:25:47 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/decode.js:19:46 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/Parse.js:31:44 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/index.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at AppProviders.tsx:11:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at index.js:6:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/metro-runtime/src/polyfills/require.js:201:44 in guardedLoadModule
- ... 2 more stack frames from framework internals

Unhandled promise rejection, [ReferenceError: Can't find variable: localStorage]
at node_modules/core-js-pure/internals/host-report-errors.js:6:47 in module.exports
at node_modules/core-js-pure/modules/es.promise.js:158:57 in dispatchEvent
at node_modules/core-js-pure/modules/es.promise.js:171:28 in perform$argument_0
at node_modules/core-js-pure/internals/perform.js:3:38 in module.exports
at node_modules/core-js-pure/modules/es.promise.js:168:22 in call$argument_2

TypeError: undefined is not an object (evaluating 'EventEmitter.prototype.addListener')
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:172:19 in handleException
at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:6 in handleError
at node_modules/expo-error-recovery/build/ErrorRecovery.fx.js:12:21 in ErrorUtils.setGlobalHandler$argument_0

So I try to workaround it by using normal Moralis library:

import Moralis from "moralis";
Moralis.setAsyncStorage(AsyncStorage)
Moralis.start({appId: "my app id", serverUrl: "my server url"})

But it still turns out the error:

The provided value 'ms-stream' is not a valid 'responseType'.
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:189:6 in set__responseType
at node_modules/stream-http/lib/capability.js:36:5 in checkTypeSupport
at node_modules/stream-http/lib/capability.js:48:53 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/lib/request.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/index.js:1:27 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/xml-http-request.js:21:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/index.js:6:16 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-providers-http/lib/index.js:25:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core-requestmanager/lib/index.js:45:25 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core/lib/index.js:22:30 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3/lib/index.js:29:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/MoralisWeb3.js:55:41 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/ParseUser.js:51:48 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/ParseACL.js:25:47 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/decode.js:19:46 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/Parse.js:31:44 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/index.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at AppProviders.tsx:11:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at index.js:6:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/metro-runtime/src/polyfills/require.js:201:44 in guardedLoadModule
- ... 2 more stack frames from framework internals

The provided value 'moz-chunked-arraybuffer' is not a valid 'responseType'.
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:189:6 in set__responseType
at node_modules/stream-http/lib/capability.js:36:5 in checkTypeSupport
at node_modules/stream-http/lib/capability.js:49:66 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/lib/request.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/index.js:1:27 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/xml-http-request.js:21:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/index.js:6:16 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-providers-http/lib/index.js:25:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core-requestmanager/lib/index.js:45:25 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core/lib/index.js:22:30 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3/lib/index.js:29:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/MoralisWeb3.js:55:41 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/ParseUser.js:51:48 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/ParseACL.js:25:47 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/decode.js:19:46 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/browser/Parse.js:31:44 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/index.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at AppProviders.tsx:11:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at index.js:6:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/metro-runtime/src/polyfills/require.js:201:44 in guardedLoadModule
- ... 2 more stack frames from framework internals

Unhandled promise rejection, [ReferenceError: Can't find variable: localStorage]
at node_modules/core-js-pure/internals/host-report-errors.js:6:47 in module.exports
at node_modules/core-js-pure/modules/es.promise.js:158:57 in dispatchEvent
at node_modules/core-js-pure/modules/es.promise.js:171:28 in perform$argument_0
at node_modules/core-js-pure/internals/perform.js:3:38 in module.exports
at node_modules/core-js-pure/modules/es.promise.js:168:22 in call$argument_2

I really want to know how the official cli boilerplate gets around that. I do not really see the difference between what I do and the way it does in the boilerplate.

The version I am using is also the same as boilerplate:

    "moralis": "0.0.99",
    "react-moralis": "0.2.7",

cheethkeeth · January 10, 2022, 4:32pm

I’m getting something similar, I upgraded moralis to 0.0.183 and moralis-react 0.3.11. But now I get can’t find variable local storage. Even after adding:

const Moralis = require('moralis/react-native.js');
const AsyncStorage = require('react-native').AsyncStorage;
Moralis.setAsyncStorage(AsyncStorage);

HHouaiss · January 10, 2022, 10:19pm

Thank you for the response,
I updated it, but i still have the warning.

HHouaiss · January 10, 2022, 10:43pm

I resolved the problem. but now i have this error :

Jackson · January 11, 2022, 8:35am

add .js to your import make it look like this
import Moralis from “moralis/react-native.js”;

happyeric77 · January 11, 2022, 9:29am

Thanks for the replay. I actually did use

import Moralis from "moralis/react-native.js";

But no lock.

Raheel · January 11, 2022, 9:52am

Hi bro,
Did you find something I am facing the same issue while calling smart contract?

gen · January 11, 2022, 11:49am

@HHouaiss @happyeric77 Hi guys! try updating react-native and react-moralis dependencies on your package.json like this: "react-native": "~0.63.3" and "react-moralis": "0.2.7".

happyeric77 · January 11, 2022, 12:29pm

Thanks for your reply, I just tried it (modified the package.json, remove package.lock.json and npm install) now but still no luck with the error below:

The provided value 'ms-stream' is not a valid 'responseType'.
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:189:6 in set__responseType
at node_modules/stream-http/lib/capability.js:36:5 in checkTypeSupport
at node_modules/stream-http/lib/capability.js:48:53 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/lib/request.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/index.js:1:27 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/xml-http-request.js:21:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/index.js:6:16 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-providers-http/lib/index.js:25:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core-requestmanager/lib/index.js:45:25 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core/lib/index.js:22:30 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3/lib/index.js:29:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/MoralisWeb3.js:20:41 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/ParseUser.js:34:48 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/ParseACL.js:14:47 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/decode.js:8:46 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/Parse.js:15:44 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/react-native.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at AppProviders.tsx:13:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at index.js:6:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/metro-runtime/src/polyfills/require.js:201:44 in guardedLoadModule
- ... 2 more stack frames from framework internals

TypeError: undefined is not an object (evaluating 'EventEmitter.prototype.addListener')
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
- ... 6 more stack frames from framework internals

The provided value 'moz-chunked-arraybuffer' is not a valid 'responseType'.
at node_modules/react-native/Libraries/Network/XMLHttpRequest.js:189:6 in set__responseType
at node_modules/stream-http/lib/capability.js:36:5 in checkTypeSupport
at node_modules/stream-http/lib/capability.js:49:66 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/lib/request.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/stream-http/index.js:1:27 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/xml-http-request.js:21:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/xhr2-cookies/dist/index.js:6:16 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-providers-http/lib/index.js:25:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core-requestmanager/lib/index.js:45:25 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3-core/lib/index.js:22:30 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/web3/lib/index.js:29:18 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/MoralisWeb3.js:20:41 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/ParseUser.js:34:48 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/ParseACL.js:14:47 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/decode.js:8:46 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/lib/react-native/Parse.js:15:44 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/moralis/react-native.js:1:24 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at AppProviders.tsx:13:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at index.js:6:0 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at node_modules/metro-runtime/src/polyfills/require.js:201:44 in guardedLoadModule
- ... 2 more stack frames from framework internals

Invariant Violation: "main" has not been registered. This can happen if:
* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
* A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called.
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:172:19 in handleException
at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:6 in handleError
at node_modules/@react-native/polyfills/error-guard.js:49:36 in ErrorUtils.reportFatalError

my package.json is also listed below FYI:

{
  "name": "project_mobile_app_dev",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "@react-native-async-storage/async-storage": "^1.15.14",
    "@react-navigation/native": "^6.0.6",
    "@react-navigation/native-stack": "^6.2.5",
    "expo": "~44.0.0",
    "expo-status-bar": "~1.2.0",
    "react": "17.0.1",
    "react-dom": "17.0.1",
    "react-native": "~0.64.3",
    "react-native-safe-area-context": "3.3.2",
    "react-native-screens": "~3.10.1",
    "react-native-web": "0.17.1",
    "@walletconnect/react-native-dapp": "^1.7.0",
    "base-64": "^1.0.0",
    "crypto-browserify": "^3.12.0",
    "expo-web-browser": "~10.1.0",
    "https-browserify": "^1.0.0",
    "node-libs-react-native": "^1.2.1",
    "os-browserify": "^0.3.0",
    "path-browserify": "^1.0.1",
    "react-native-get-random-values": "~1.7.0",
    "react-native-tcp": "^4.0.0",
    "readable-stream": "^3.6.0",
    "stream-http": "^3.2.0",
    "vm-browserify": "^1.1.2",
    "expo-app-loading": "~1.3.0",
    "@eva-design/eva": "^2.1.1",
    "react-native-dotenv": "^3.3.1",
    "moralis": "0.0.183",
    "react-moralis": "0.2.7",
    "web3": "^1.6.0",
    "@walletconnect/web3-provider": "^1.6.6"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@types/react": "~17.0.21",
    "@types/react-native": "~0.64.12",
    "typescript": "~4.3.5",
    "jest-expo": "~44.0.1",
    "jest": "^26.6.3",
    "react-test-renderer": "17.0.1"
  },
  "private": true
}

Let me also share my AppProvider.tsx code in which I wrap my App.tsx into WalletConnect provider. It had been working fine untill I tried to add a wrapper of MoralisProvider. So I commented out all moralis related code and then only left setAsyncStorage there to debug. Then I also turned out error so that I think the issue is from setting asyncStorage.

import React from "react";
import AsyncStorage from "@react-native-async-storage/async-storage";
import WalletConnectProvider, { WalletConnectProviderProps } from "@walletconnect/react-native-dapp";
import { Platform} from "react-native";
import { expo } from "./app.json";
const { scheme } = expo;
import App from "./App";

import { MoralisProvider } from "react-moralis"



import Moralis from "moralis/react-native.js";
Moralis.setAsyncStorage(AsyncStorage)
// Moralis.start({appId: "YNGTdQEGlHEuG5xLEVP2NK5TSezl9x3Fi3eyQEOv", serverUrl: "https://li8crrzx4alq.grandmoralis.com:2053/server"})



const walletConnectOptions: WalletConnectProviderProps = {
    redirectUrl: Platform.OS === "web" ? window.location.origin : `${scheme}://`,
    storageOptions: {
        // @ts-ignore
        asyncStorage: AsyncStorage,
    },
    qrcodeModalOptions: {
        mobileLinks: [
            "rainbow",
            "metamask",
            "argent",
            "trust",
            "imtoken",
            "pillar",
        ],
    },
  // Uncomment to show a QR-code to connect a wallet
  // renderQrcodeModal: Qrcode,
};

export const AppProviders = ({ children }: any) => {
    return (        
        <WalletConnectProvider {...walletConnectOptions}>
            {/* <MoralisProvider
            appId="my app id"
            serverUrl="my server url"
            environment="native"> */}
            <App/>
            {/* </MoralisProvider> */}
        </WalletConnectProvider>
        
    );
};

gen · January 11, 2022, 12:39pm

@happyeric77 can you refer to this? I made this CLI version of this boilerplate. I managed to resolve most issues when trying to create your own version of this boilerplate. This might or might not help you with your current codebase but I believe this could be valuable to you if you also want to create an ethereum react-native app without expo. We will be publishing this officially as soon once we tested it enough.

happyeric77 · January 11, 2022, 12:43pm

Hi Gen, Really thanks for your sharing. I understand the boilderplate currently only supports rn_cli without expo. So what I am trying to do is create one to work with expo (go) from scratch. Does it mean it is not possible? If yes, it will be very appreciated if I could know what would be the technical barrier.

happyeric77 · January 11, 2022, 1:16pm

My codebase is super simple. You could have a check if you have time ( the number 4 branch of the below repo.)
I believe everything happens only in AppProvider.tsx file

gen · January 11, 2022, 1:02pm

Great! I’ll check this out now! : smiley:

gen · January 11, 2022, 1:41pm

@happyeric77 I think I was able to run it. Correct me if I’m wrong. Please see screenshots:

If this is correct, I’ll create a PR for this in your repo

happyeric77 · January 11, 2022, 2:10pm

@gen AWSOME, it is correct. Please kindly help to issue a PR on my repo. Thank you so much!!
I ready would like to know where did I do wrong.

happyeric77 · January 11, 2022, 2:50pm

@gen
I created an issue for the repo. If possible, would you make a comment. And I could assign it to you if you do not mind.

gen · January 11, 2022, 3:03pm

@happyeric77 I’ll just share the fix here so anyone with the same issue can refer to it. After cloning the app and switching to the 4.Moralis_provider branch, I just deleted package-lock.json and yarn.lock. Then I changed the react-native version to "react-native": "0.63.3" in the package.json file. Then I run yarn install. After it finished downloading node_modules, I ran expo start. Try deleting node_modules and repeat the same process I did.

gen · January 11, 2022, 3:13pm

@happyeric77 I also left a comment on this issue.

happyeric77 · January 11, 2022, 3:37pm

@gen
Thanks, Man!!! you really save my day.
I just downgraded the react-native version from 0.64.3 to 0.63.3. Then I now can get into the app even it shows some warnings below :

I am not sure if it will be a matter afterward, but at least now I can call moralis function with no problem.

gen · January 11, 2022, 4:21pm

@zadu try downgrading react-native version to “react-native”: “0.63.3”. I think there are some mapping issues with the higher versions of react-native that are causing this issue. Let me know if this worked. " Thanks!