Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Native Chrome Debugger Error: NativeUIManager.getConstantsForViewManager('Text') threw an exception

Tags:

react-native

I'm newly developing in react native.

To start I used npx react-native init hello_world --template react-native-template-typescript to create the basic code and then I replaced app.tsx with this code:

import React from 'react';
import {StyleSheet, Text, View} from 'react-native';

const App = () => {
  return (
    <View style={styles.helloWorldContainer}>
      <Text style={{fontSize: 18}}>Hello, world!</Text>
    </View>
  );
};

const styles = StyleSheet.create({
  helloWorldContainer: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
});

export default App;

And these are the errors that I get when I am in debug mode: Error picture 1 Error picture 2

If I remove the style of the component Text the error disappears. My question is how can I fix the error while keeping the style in the component Text. I saw that chrome has a lot of errors, exist another better debugger?

like image 275
Pablo Arrettino Avatar asked Aug 26 '21 14:08

Pablo Arrettino


People also ask

Why does `nativeuimanager getconstantsforviewmanager` throw an exception?

`NativeUIManager.getConstantsForViewManager ('Text') threw an exception. Invariant Violation: Calling synchronous methods on native modules is not supported in Chrome. Consider providing alternative methods to expose this method in debug mode, e.g. by exposing constants ahead-of-time.

How to debug react native Android apps using Google Chrome debugger?

Google chrome debugger tool also known as Chrome debug is used by many react native developers to debug react native android apps. Debug means checking the app for errors or API class data in the background using custom tool. The debug tool works with Console.log () method.

Does the react developer tools Chrome extension work with React Native?

Note: the React Developer Tools Chrome extension does not work with React Native, but you can use its standalone version instead. Read this section to learn how. To use a custom JavaScript debugger in place of Chrome Developer Tools, set the REACT_DEBUGGER environment variable to a command that will start your custom debugger.

How to run React Native on Android emulator?

The first step is to start the android emulator in your computer. Now start the NPM server or launch the react native app in your emulator. Make sure you have installed Google Chrome Web Browser in your computer. 2. To open the Debug menu we have to simulate the shack device functionality in our emulator.


1 Answers

As what Lucas Azambuja Santos referred to, it's a bug in react-native 0.65.* check out the new issue https://github.com/facebook/react-native/issues/32197

it should be fixed with 0.66, to workaround downgrade to 0.64.x and rebuild:

cd android && ./gradlew clean cleanBuildCache
like image 153
cinatic Avatar answered Oct 24 '22 16:10

cinatic