I'm working on a react-native IOS app, and this app sometimes will raise a Warning message "setState(...) Can only update a mounted or mounting component. ...", I understand what the message is about, it is caused by the long time AJAX call.
Considering this warning will not cause any serious issue for the APP, I don't want to spend much time to fix it at this moment, this warning message will show up in both simulator and cellphone while loading from development server. My question is whether the warning message will still prompt in product mode (Load from pre-bundled file)? If it will still show up, how to disable this Warning message from configuration?
Thanks.
the better solution is to write this in your index file:
console.disableYellowBox = true;
To disable only this warning message use the following code on possible files
console.ignoredYellowBox = ['Warning: setState(...)'];
To disable only the setState message
The "setState(...) Can only update a mounted or mounting component." is thrown from 4 possible files :
node_modules/react/dist/react-with-addons.js
node_modules/react/dist/react.js
node_modules/react/lib/ReactNoopUpdateQueue.js
node_modules/react/lib/ReactUpdateQueue.js
I don't know which one triggered yours, but you can modify those files to not show the warning. If your concern is for your users, that is to say in release mode, then the dev flag is false which means that will not see any warning messages.
To disable all warnings
To disable the warnings, just change this in your AppDelegate.m :
jsCodeLocation = [NSURL URLWithString:#"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
to
jsCodeLocation = [NSURL URLWithString:#"http://localhost:8081/index.ios.bundle?platform=ios&dev=false"];
If you're using the pre-bundled file you'll have to specify dev as false when bundling :
react-native bundle --dev false --entry-file index.ios.js --bundle-output ios/main.jsbundle --platform ios
Just to answer to question you asked, no, the warning will not show up when you load from a pre-bundled file (like when testing with TestFlight).
I edited my App.js file and added this:
console.ignoredYellowBox = ['Warning: Can only update a mounted', '-[EXCamera updateFocusDepth'];
You can provide an array of things you want to ignore. Simply provide a prefix of ones you want to ignore, no '*' or other wildcard required.
For Remote debugger
console.ignoredYellowBox = ['Remote debugger'];
and for all warning
console.disableYellowBox = true;
Related
Is there a way to clear cache in webview for both ios and android?
I tried using #react-native-community_cookies, it works for ios, but for android Im getting this error when trying to run: A problem occurred evaluating project ':#react-native-community_cookies'. > Plugin with id 'maven' not found.
Maybe any of you have suggestions how to fix this or know some other methods?
Thanks
You can use this plugin https://www.npmjs.com/package/#react-native-community/cookies for clear cache and write below function
import CookieManager from '#react-native-community/cookies';
CookieManager.clearAll(true)
The true param means that it will clear cookies for the webkit webview (which is what this library uses)
Check out this library it does the job done.
https://github.com/react-native-cookies/cookies
import CookieManager from '#react-native-cookies/cookies';
CookieManager.clearAll(true);
Our bundle entry point is at src/index.tsx, which appears not to match the Sentry default of ./index.js.
Sentry is failing on sentry-cli react-native-xcode with the error EOF while parsing a value at line 1 column 0.
Using debug log level, I see:
+ ENTRY_FILE=index.js
...
Error: The resource `/Users/lukecwilliams/Projects/mobile2mr/index.js` was not found.
And in the actual CLI command, this is being run: --entry-file index.js
We need instead --entry-file src/index.tsx. How can we customize this? I can't find an answer in the docs or source code.
I've found this solution (custom build script) but it's still not working.
I have a script in the project root:
sentry-cli-xcode-build.sh:
./node_modules/react-native/packager/react-native-xcode.sh ./src/index.tsx
And in the build command in project.pbxproj:
shellScript = "export SENTRY_PROPERTIES=sentry.properties\nexport EXTRA_PACKAGER_ARGS=\"--sourcemap-output $DERIVED_FILE_DIR/main.jsbundle.map\"\nexport NODE_BINARY=node\n../node_modules/#sentry/cli/bin/sentry-cli react-native xcode ../sentry-cli-xcode-build.sh";
But the result is a fairly ambiguous: error: Permission denied (os error 13)
Do I need to change the directory setup somehow? I don't see a concrete example in Sentry docs or the GH answer above regarding where to put the script and how to reference it exactly.
It turns out that this build step should simply be disabled in iOS projects using Bitcode (which is the default). So, we have no more need to run a custom build script.
We'll use Fastlane afterward to upload debug symbols.
Docs for reference:: https://docs.sentry.io/platforms/react-native/#ios-specifics
The answer is
export ENTRY_FILE=index.ios.js
in the script
I followed the official docs to enable the Hermes engine in my app but the following always returns false:
const isHermes = () => !!global.HermesInternal;
console.log('>>>>>>>>>>>>>', isHermes());
The changes I made are setting the following in android/app/build.gradle:
project.ext.react = [
enableHermes: true, // clean and rebuild if changing
]
Then I did a clean build with:
cd android && ./gradlew clean
yarn android
But the console.log always returns false
I too got false when console.logging isHermes(). I realized it was because I was using the normal Chrome debugger(not sure of the internals of why). When I just console.logged in VSCode, I got true. There is a special way (sorry, my 'Copy link to highlight' isn't working, it's about 1/4 of the way down the page) you have to set up the Chrome debugger when you are using Hermes. There seems to be some trouble with getting it to work with newer versions of Chrome though. My plan right now to verify I'm actually using it is to compare the size of the binary before and after enabling Hermes.
Working with:
"react-native": "0.51"
When I console.log in Remote JS Debugger, the source of the log is always:
console.js:35
It ignores the actual line where the log was made from. This used to work as expected. Is there a way to make it work again?
I found that this was actually caused by having React Native Sentry installed.
To resolve this whilst in development mode I disabled Sentry, which arguably makes more sense as I only want to be tracking production errors there.
// Only run Sentry in production
if (!__DEV__) {
Sentry.config(_CONFIG_URL_HERE_).install();
}
If you don't want to disable Sentry, add this to your Sentry init:
Sentry.init({
dsn: '__YOUR_DSN__',
integrations: [new Sentry.Integrations.Breadcrumbs({
console: false
})]
})
The Debug JS Remotely option is currently set to true in my development build. I'd like to disable this feature, but my emulator is simply to slow to do so.
Does anybody know how to disable Debug JS Remotely without tapping the button inside the react-native menu onShake? Perhaps, by hard-coding a value inside my apps iOS directory, or passing in a flag to react-native run-ios?
Here's a link to every known instance of the `isDebuggingRemotely boolean flag I'm aiming to set to false inside the react-native GitHub.
This code may work:
iOS
#import <React/RCTDevSettings.h>
rootView.bridge.devSettings.isDebuggingRemotely = NO;
Android
getReactNativeHost()
.getReactInstanceManager()
.getDevSupportManager()
.getDevSettings()
.setRemoteJSDebugEnabled(false);