Ethereum React Native Boilerplate Questions

Hello @apost crypto is now available in node. If you are trying to install all dependencies from this boilerplate to your new react-native project, you should include crypto and other modules that could not be found under post-install in your package.json. I’m currently creating a CLI version of this boilerplate and I managed to fix most issues including this one that you encountered. If you find it interesting, you can check it here:

It’s still unofficial but we will publish it once we confirm this to be working on most dev environments and will delete this one in my repo.

1 Like

Hello :slight_smile:

I’m working on the React Native Boilerplate on ‘web’ and got this error :

Do you have a solution ?

Thank you for your response :slight_smile:

Hassan.

Update react-native-web to latest version

Hey guys,

I am creating users in my app using email/password sign up and login. I get a warning saying Non ethereum enabled browser. Then when I try and link a wallet to this user using something like

Moralis.Web3.link('MyWalletAddress');

I get the following error:

Possible Unhandled Promise Rejection (id: 0):
Error: Non ethereum enabled browser

And this doesn’t update the users accounts field in my user DB as would be the desired result from linking. Any help would be greatly appreciated. Cheers

@cwong Thanks, It is very helpful since I am trying to use expo with moralis lib. Everything is working fine when I only use “wallet-connect”. But it turns our error when I try to bring moralis lib in.
following error occurs when I only import the MoralisProvider setting credential and wrap it in side the walletconnectprovider.

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"

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 appid"
            serverUrl="my server url">
            <App/>
            </MoralisProvider>
        </WalletConnectProvider>
        
    );
};

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/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 node_modules/react-moralis/lib/index.cjs.js:7:28 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at AppProviders.tsx:9: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 node_modules/react-moralis/lib/index.cjs.js:7:28 in <global>
at node_modules/metro-runtime/src/polyfills/require.js:349:11 in loadModuleImplementation
at AppProviders.tsx:9: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

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

It is appreciated if you can share the solution if you have got it resolved.

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",

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);

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

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

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

Thanks for the replay. I actually did use

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

But no lock.

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

@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".

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>
        
    );
};

@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.

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.

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

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

@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 :smiley:

@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.

1 Like