Currently my app is getting a lot of yellow banner warnings for component will mount, however I am unable to get rid of them as they are in third party libraries. Is there a way I can make them not come up as they are disruptive for development?
In my case I've been able to do it with the YellowBox module.
I'm using an Expo managed project v38 that uses React Native v0.62.
Example:
import { YellowBox } from "react-native";
YellowBox.ignoreWarnings([
"componentWillReceiveProps has been renamed, and is not recommended for use."
]);
For later versions the LogBox module must be used: https://reactnative.dev/blog/2020/07/06/version-0.63
Related
I'm using an Expo Bare Workflow setup with my React Native App.
I followed this guide EXACTLY https://redux-toolkit.js.org/tutorials/quick-start copy pasted everything.
Imported
import { store } from "./src/main/redux/store";
import { Provider } from "react-redux";
on my App.js but it crashes when I build the app for Expo Go testing using eas update. If I remove those two imports, the app works fine.
I've followed the quickstart guide exactly, so for the code you can refer to the quick start guide as it might be redundant if I still post it here.
There's no error message from the App because it crashes on startup. I do get one from xcode saying com.facebook.ABI46_0_0React.ExceptionsManagerQueue and the rest are some obscure messages
i'm using React Native expo, and it shows
[Warning: Async Storage has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '#react-native-community/async-storage' instead of 'react-native'. See https://github.com/react-native-community/react-native-async-storage].
i read this link and I understood that it's due to the fact that some dependencies are using old AsyncStorage, not the new one from community.
But I hardly found that any solution for Expo users. Is there any solution for Expo? Or if I have to manual change dependencies using the old AsyncStorage, how can i do it? Since I'm new to React Native, not really sure what to do..
In Expo you should always link the libraries that Expo includes in the App. So like mentioned in the docs here https://docs.expo.dev/versions/latest/sdk/async-storage/
expo install #react-native-async-storage/async-storage
is the correct import. If you are working with an old Expo-SDK this might be different, otherwise you should adapt your imports.
Now expo has migrated to use as well the community version as you can see here.
But if you get this warning definitely you have some dependency or more that still use the react-native-core version, if so please refer to the first answer to How to resolve using AsyncStorage (deprecated) warning? Using the community (correct) library:
if this is the case the best is as suggested in that answer is to
Your best course of action is to fork the repo and fix all instances of AsyncStorage to use the correct version, or open an issue.
This error occurs because firebase imports AsyncStorage from react native core and not the new library #react-native-async-storage/async-storage. I think firebase hasn't updated the by default import yet so you have to do it yourself.The way I fixed it was ;
Install react-native-async-storage: npm i #react-native-async-storage/async-storage
Go into the firebase index.js file that imports AsyncStorage from react native core: It is located at : 'node_modules/#firebase/auth/dist/rn'.
Create a variable that imports AsycnStorage from 'node-modules/#react-native-async-storage/async-storage' :
var AsyncStorage = require('../../../../#react-native-async-storage/async-storage');
Replace all uses of AsyncStorage in this file from react native core with new variable, i.e. replace "ReactNative__namespace.AsyncStorage" with "AsycnStorage",
Some help would be appreciated with the following issue:
I'm trying to get the non-minified output. For some reason, I keep getting Error: Minified React error even when I run the app in development mode.
I can open the development tools and with the code below I can see Development is printed in the console.
if (__DEV__) {
console.log('Development');
} else {
console.log('Production');
}
I started the project with npx react-native init AwesomeProject and made an error.
How can i set up the non-minified dev environment.
When I used a template project with expo and did an eject to react native it was using the the non-minified dev environment. Can someone explain how i can set this up on the creation of a new project with npx?
Having an incorrect import was causing this issue.
I let IntelliJ import useState without verifying it.
Changing the import from:
import {useState} from 'react/cjs/react.production.min';
To
import {useState} from 'react';
fixes the issues.
I'm using react native and I am trying to use Material-UI icons.
I have npm installed both #material-ui and #material-ui/icons.
I have included:
import AddIcon from "#material-ui/icons/Add";
To the top and I have the icon in my return as:
<AddIcon />
However I'm getting the error
Invariant Violation: View config getter callback for component 'path'
must be a function (received 'undefined'). Make sure to start
component names with a capital letter.
Removing the <AddIcon/> removes the error but then obviously the icon doesn't show.
I'm using react-native and expo. I'm not using an emulator or android studio. I'm coding this project in Visual Studio Code.
You can use a library installed by default in expo
Change Ionicons with the name of icon you want & always check docs !
https://docs.expo.io/guides/icons/
import { Ionicons } from '#expo/vector-icons';
Try this library where in you can show material icons. This library provides range of icons.
https://youtu.be/BjrlrGy_HaY
This includes installation of vector icons npm package and demonstrates the uses of vector icons library.
How start remote debug on the very first app run in react native?
I use developer menu to start Open debugger and the app reloads so it's not possible to debug code that occurs on a very first run only.
I have finally found a solution in this article.
It's possible to start Open Debugger programmatically on iOS
import { NativeModules } from 'react-native';
if (__DEV__) {
NativeModules.DevSettings.setIsDebuggingRemotely(true)
}
react-native-devsettings-android library is required to run this code on android
You need to hardcode it in native code.
For android i believe its this one:
https://github.com/facebook/react-native/blob/786c1ecc2a6856967d676da68eb02f89eb38fb79/ReactAndroid/src/main/java/com/facebook/react/devsupport/DevInternalSettings.java#L88