After I do a shoutem run-ios, the app builds fine and loads the splash page. As soon as it goes to the main screen, I get the red error screen with this message:
console.error: "Unhandled promise rejction"
In the logs, I see the following error:
TypeError: Cannot read property 'Symbol(Symbol.iterator)' of null
at launchEditor (/Users/njdeveloper/.shoutem/platforms/build/node_modules/react-native/local-cli/server/util/launchEditor.js:153:29)
at Object.handle (/Users/njdeveloper/.shoutem/platforms/build/node_modules/react-native/local-cli/server/middleware/openStackFrameInEditorMiddleware.js:17:7)
at next (/Users/njdeveloper/.shoutem/platforms/build/node_modules/connect/lib/proto.js:174:15)
at Object.handle (/Users/njdeveloper/.shoutem/platforms/build/node_modules/react-native/local-cli/server/middleware/getDevToolsMiddleware.js:74:7)
at next (/Users/njdeveloper/.shoutem/platforms/build/node_modules/connect/lib/proto.js:174:15)
at Object.handle (/Users/njdeveloper/.shoutem/platforms/build/node_modules/react-native/local-cli/server/middleware/getDevToolsMiddleware.js:74:7)
at next (/Users/njdeveloper/.shoutem/platforms/build/node_modules/connect/lib/proto.js:174:15)
at Object.compression [as handle] (/Users/njdeveloper/.shoutem/platforms/build/node_modules/compression/index.js:205:5)
at next (/Users/njdeveloper/.shoutem/platforms/build/node_modules/connect/lib/proto.js:174:15)
at IncomingMessage. (/Users/njdeveloper/.shoutem/platforms/build/node_modules/react-native/local-cli/server/middleware/loadRawBodyMiddleware.js:20:5)
Related
Code:
import {
GoogleSigninButton,GoogleSignin
} from '#react-native-google-signin/google-signin';
const CLIENT_ID = "client_id";
<GoogleSigninButton
clientId={CLIENT_ID}
render={(renderProps) => (
<Button
className={classes.googleButton}
color="secondary"
fullWidth
onClick={renderProps.onClick}
disabled={renderProps.disabled}
variant="contained"
>
Google Sign In
</Button>
)}
onSuccess={googleSuccess}
onFailure={googleError}
cookiePolicy="single_host_origin"
/>
Error message:
ERROR RN GoogleSignin native module is not correctly linked. Please read the readme, setup and troubleshooting instructions carefully or try manual linking. If you're using Expo, please use expo-google-sign-in. This is because Expo does not support custom native modules.
ERROR TypeError: null is not an object (evaluating 'RNGoogleSignin.SIGN_IN_CANCELLED')
ERROR 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.
When I have an error in my React Native app, the stack trace that is printed to the console points to index.bundle instead of the original source code (see example below). Is there a way to configure React Native to use source maps so that the logs show up correctly?
This problem only occurs when throwing an error from an asynchronous callback or something outside of rendering. If I throw an error inside a component, then the error shows the correct stack trace in the console. Interestingly, the error shows the correct stack trace all the time in LogBox.
I am running this with react-native run-android and viewing the logs through Metro. To clarify, I am trying to get this working for local debug builds, not production/release builds. Ideally the logs would show the correct stack in the console so that I do not have to symbolicate them manually or find the error in LogBox.
Example result from console.error:
Error: Connection closed
at anonymous (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp.local&modulesOnly=false&runModule=true:261835:40)
at forEach (native)
at flushVolatile (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp.local&modulesOnly=false&runModule=true:261833:33)
at anonymous (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp.local&modulesOnly=false&runModule=true:262065:20)
at apply (native)
Thank you in advance!
Answering my own question. I dug into the react-native code and discovered that LogBox symbolicates stack traces by making calls to the metro development server. Instead of replicating that logic, I made the hacky solution below that ties into LogBox. I'm sure there are better ways to do this, but it works.
import { observe as observeLogBoxLogs, symbolicateLogNow } from 'react-native/Libraries/LogBox/Data/LogBoxData';
// LogBox keeps all logs that you have not viewed yet.
// When a new log comes in, we only want to print out the new ones.
let lastCount = 0;
observeLogBoxLogs(data => {
const logs = Array.from(data.logs);
const symbolicatedLogs = logs.filter(log => log.symbolicated.stack?.length);
for (let i = lastCount; i < symbolicatedLogs.length; i++) {
// use log instead of warn/error to prevent resending error to LogBox
console.log(formatLog(symbolicatedLogs[i]));
}
lastCount = symbolicatedLogs.length;
// Trigger symbolication on remaining logs because
// logs do not symbolicate until you click on LogBox
logs.filter(log => log.symbolicated.status === 'NONE').forEach(log => symbolicateLogNow(log));
});
function formatLog(log) {
const stackLines = (log.symbolicated.stack || [])
.filter(line => !line.collapse)
.map(line => ` at ${line.methodName} (${line.file}:${line.lineNumber}:${line.column})`)
.join('\n');
return `Error has been symbolicated\nError: ${log.message.content}\n${stackLines}`;
}
The error appears twice in console, first as the original, second as the symbolicated version. Here's an example of the log output now:
WARN Error: Connection closed
Error: Connection closed
at anonymous (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:334491:50)
at forEach (native)
at flushVolatile (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:334489:43)
at anonymous (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:334721:30)
at call (native)
at emitNone (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:340110:33)
at emit (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:340191:23)
at anonymous (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:339907:24)
at anonymous (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:339889:30)
at apply (native)
at anonymous (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:347770:25)
at drainQueue (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:347735:45)
at apply (native)
at anonymous (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:31681:26)
at _callTimer (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:31605:17)
at callTimers (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:31801:19)
at apply (native)
at __callFunction (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:25085:36)
at anonymous (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:24813:31)
at __guard (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:25039:15)
at callFunctionReturnFlushedQueue (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.logtest.local&modulesOnly=false&runModule=true:24812:21)
LOG Error has been symbolicated
Error: Connection closed
at Object.keys.forEach$argument_0 (/Users/georgeflug/projects/logtest/node_modules/mqtt/dist/mqtt.js:208:28)
at flushVolatile (/Users/georgeflug/projects/logtest/node_modules/mqtt/dist/mqtt.js:206:4)
at stream.on$argument_1 (/Users/georgeflug/projects/logtest/node_modules/mqtt/dist/mqtt.js:477:17)
at emitNone (/Users/georgeflug/projects/logtest/node_modules/mqtt/dist/mqtt.js:6471:4)
at emit (/Users/georgeflug/projects/logtest/node_modules/mqtt/dist/mqtt.js:6556:14)
at Duplexify.prototype._destroy (/Users/georgeflug/projects/logtest/node_modules/mqtt/dist/mqtt.js:6239:2)
at process.nextTick$argument_0 (/Users/georgeflug/projects/logteste/node_modules/mqtt/dist/mqtt.js:6221:4)
at Item.prototype.run (/Users/georgeflug/projects/logtest/node_modules/mqtt/dist/mqtt.js:13143:4)
at drainQueue (/Users/georgeflug/projects/logtest/node_modules/mqtt/dist/mqtt.js:13113:16)
If you click on the stacktrace (for example in terminal) will it pull up your vscode with all the associated files and to this location? At least that you might be able to back where the issue is in code?
I've custom throw at component created() method.
throw new Error(`Cookie ${cookieName} not exist.`);
And vue logs it into console:
[Vue warn]: Error in created hook: "Error: Cookie showLanguageInfo not exist."
How can I implement throwing this error without this vue log?
Please remove the below line from created hook. The below line is throwing error without any real exception.
throw console.error("error");
I am using this.props.navigator.push method in react native. That was working fine but now i am getting error "Cannot read property 'navigator' of undefined"
this.props.navigator.push({
screen: "awesome-Projects.DashBoardScreen",
title: "Dash Board"
});
Expected Result: Go to Dash Board
Actual result: remain on same page
This is because your this.props is undefined.Mostly it is caused by that this is directed to another scope.
there is an issue typeerror undefined is not an object (evaluating '_reactnative camera.default.constants') site:stackoverflow.com
I am using react native image picker and its working fine .The RNCamera and these type of library is too old and it will crash your app