大佬教程收集整理的这篇文章主要介绍了React-Native/XCode 12.4/iOS 模拟器 - 应用启动时黑屏,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
问题:
在没有错误记录的情况下成功构建后,应用程序打开到标准 LaunchScreen.storyboard 但紧接着出现黑屏。 Metro Bundler 仍会加载,并且应用的代码会进入登录屏幕,但黑屏仍然存在并且应用对输入无响应。
我使用的:
相关包:
"react": "17.0.1","react-native": "0.64.0","@react-navigation/bottom-tabs": "^5.11.8","@react-navigation/drawer": "^5.12.4","@react-navigation/material-bottom-tabs": "^5.3.14","@react-navigation/native": "^5.9.3","@react-navigation/stack": "^5.14.3","react-native-gesture-handler": "^1.10.3","react-native-screens": "^2.18.1","react-native-safe-area-context": "^3.2.0","react-native-material-dropdown": "^0.11.1","react-native-appearance": "^0.3.4",
AppleDelegate.m
#import "AppDelegate.h"
#import <React/RCTBrIDge.h>
#import <React/RCTBundleURLProvIDer.h>
#import <React/RCTRootVIEw.h>
#import <Firebase.h>
#ifdef FB_SONARKIT_ENABLED
#import <FlipperKit/FlipperClIEnt.h>
#import <FlipperKitLayoutPlugin/FlipperKitLayoutPlugin.h>
#import <FlipperKitUserDefaultsPlugin/FKUserDefaultsPlugin.h>
#import <FlipperKitNetworkPlugin/FlipperKitNetworkPlugin.h>
#import <SKIOSNetworkPlugin/SKIOSNetworkAdapter.h>
#import <FlipperKitReactPlugin/FlipperKitReactPlugin.h>
static voID Initializeflipper(UIApplication *application) {
FlipperClIEnt *clIEnt = [FlipperClIEnt sharedClIEnt];
SKDescriptorMapper *layoutDescriptorMapper = [[SKDescriptorMapper alloc] initWithDefaults];
[clIEnt addplugin:[[FlipperKitLayoutPlugin alloc] initWithRootNode:application withDescriptorMapper:layoutDescriptorMapper]];
[clIEnt addplugin:[[FKUserDefaultsPlugin alloc] initWithSuitename:nil]];
[clIEnt addplugin:[FlipperKitReactPlugin new]];
[clIEnt addplugin:[[FlipperKitNetworkPlugin alloc] initWithNetworkAdapter:[SKIOSNetworkAdapter new]]];
[clIEnt start];
}
#endif
@implementation AppDelegate
- (BOol)application:(UIApplication *)application dIDFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
if ([FIRApp defaultApp] == nil) {
[FIRApp configure];
}
#ifdef FB_SONARKIT_ENABLED
Initializeflipper(application);
#endif
RCTBrIDge *brIDge = [[RCTBrIDge alloc] initWithDelegate:self launchOptions:launchOptions];
RCTRootVIEw *rootVIEw = [[RCTRootVIEw alloc] initWithBrIDge:brIDge
modulename:@"MyProject"
initialPropertIEs:nil];
if (@available(iOS 13.0,*)) {
rootVIEw.BACkgroundcolor = [UIcolor blackcolor];
} else {
rootVIEw.BACkgroundcolor = [UIcolor whitecolor];
}
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
UIVIEwController *rootVIEwController = [UIVIEwController new];
rootVIEwController.vIEw = rootVIEw;
self.window.rootVIEwController = rootVIEwController;
[self.window makeKeyAndVisible];
return YES;
}
- (NSURL *)sourceURLForBrIDge:(RCTBrIDge *)brIDge
{
#if DEBUG
return [[RCTBundleURLProvIDer sharedSetTings] JsBundleURLForBundleRoot:@"index" fallBACkresource:nil];
#else
return [[NSBundle mainBundle] URLForresource:@"main" withExtension:@"Jsbundle"];
#endif
}
@end
Index.Js
import App from './App';
import { name as appname } from './app.Json';
import AsyncStorage from '@react-native-community/async-storage';
import { AppRegistry,Platform } from 'react-native';
import { gestureHandlerRootHOC } from 'react-native-gesture-handler';
AppRegistry.registerComponent(appname,() => gestureHandlerRootHOC(App));
App.Js
import React,{ useState,useEffect } from 'react';
import { Root } from 'native-base';
import { AppearanceProvIDer } from 'react-native-appearance';
import AppContainer from './AppContainer.Js'
export default App = () => {
return(
<Root>
<AppearanceProvIDer>
<AppContainer />
</AppearanceProvIDer>
</Root>
)
}
AppContainer.Js
import { NavigationContainer,useNavigation } from "@react-navigation/native";
const AppContainer = () => {
const { store,actions } = useContext(Context)
const routenameRef = useRef();
const navigationRef = useRef();
return(
<NavigationContainer
ref={navigationRef}
onReady={() => routenameRef.current = navigationRef.current.getCurrentRoute().namE}
onStateChange={() => {
const prevIoUsRoutename = routenameRef.current;
const currentRoutename = navigationRef.current.getCurrentRoute().name
actions.navigate.currentPage(currentRouteName)
// Save the current route name for later comparision
routenameRef.current = currentRoutename;
}}>
<NavContainer /> // ALL PAGES HERE,STARTS WITH SPALH PAGE
</NavigationContainer>
)
}
export default Store(AppContainer);
我的尝试:
1.后台程序导航功能 => 仍然黑屏且无响应
尽管我只看到黑屏,但我的控制台日志显示 react-navigation 正在运行。首先,SPALSH 页面打开,然后进入登录页面,如下所示。
终端控制台日志:
WARN AsyncStorage 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-async-storage/async-storage' instead of 'react-native'. See https://github.com/react-native-async-storage/async-storage
LOG Running "MyProject" with {"roottag":11,"initialProps":{}}
LOG You are Now in the SPLASH PAGE
LOG Null User Token
LOG You are Now in the LOGIN PAGE
LOG You are Now in the LOGIN PAGE
XCode 调试日志:
The default Firebase app has not yet been configured. Add `[FIRApp configure];` (`FirebaseApp.configure()` in Swift) to your application initialization.
7.9.0 - [Firebase/Core][I-COR000008] The project's Bundle ID is inconsistent with either the Bundle ID in 'Googleservice-Info.pList',or the Bundle ID in the options if you are using a customized options. To ensure that everything can be configured correctly,you may need to make the Bundle IDs consistent. To conTinue with this pList file,you may change your app's bundle IDentifIEr to 'MyProject'. Or you can download a new configuration file that matches your bundle IDentifIEr from https://console.firebase.Google.com/ and replace the current one.
[Firebase/Analytics][I-ACs023007] Analytics v.7.9.0 started
[Firebase/Analytics][I-ACs023008] To enable deBUG logging set the following application argument: -FIRAnalyticsDeBUGEnabled
Firebase/messaging][I-FCM001000] FIRmessaging Remote Notifications proxy enabled,will swizzle remote notification receiver handlers. If you'd prefer to manually integrate Firebase messaging,add "FirebaseAppDelegateProxyEnabled" to your Info.pList,and set it to NO. Follow the instructions at:
https://firebase.Google.com/docs/cloud-messaging/ios/clIEnt#method_swizzling_in_firebase_messaging
to ensure proper integration.
flipper: FlipperClIEnt::addplugin Inspector
flipper: FlipperClIEnt::addplugin Preferences
flipper: FlipperClIEnt::addplugin React
flipper: FlipperClIEnt::addplugin Network
nw_protocol_get_quic_image_block_invoke dlopen libquic Failed
[native] Running application MyProject ({
initialProps = {
};
roottag = 1;
})
[native] RCTBrIDge required dispatch_sync to load RCTDevLoadingVIEw. This may lead to deadlocks
[Firebase/Analytics][I-ACS800023] No pending snapshot to activate. SDK name: app_measurement
[Firebase/Analytics][I-ACs023012] Analytics collection enabled
[Firebase/Analytics][I-ACs023220] Analytics screen reporTing is enabled. Call +[FIRAnalytics logEventWithname:FIREventScreenVIEw parameters:] to log a screen vIEw event. To disable automatic screen reporTing,set the flag FirebaseautomaticScreenReporTingEnabled to NO (Boolean) in the Info.pList
[JavaScript] AsyncStorage 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-async-storage/async-storage' instead of 'react-native'. See https://github.com/react-native-async-storage/async-storage
[plugin] AddInstanceForFactory: No factory registered for ID <CFUUID 0x600002826e60> F8BB1C28-BAE8-11D6-9c31-00039315CD46
[connection] nw_socket_handle_socket_event [C5.1:1] Socket SO_ERROR [61: Connection refused]
[connection] nw_socket_handle_socket_event [C5.2:1] Socket SO_ERROR [61: Connection refused]
[connection] nw_connection_get_connected_socket [C5] ClIEnt called nw_connection_get_connected_socket on unconnected nw_connection
TCP Conn 0x60000183cb00 Failed : error 0:61 [61]
[JavaScript] Running "MyProject" with {"roottag":1,"initialProps":{}}
[JavaScript] RCTBrIDge required dispatch_sync to load RCTDevLoadingVIEw. This may lead to deadlocks
[native] [GEstuRE HANDLER] Initialize gesture handler for root vIEw <RCTRootContentVIEw: 0x7fb622c0f680; reactTag: 1; frame = (0 0; 0 0); gestureRecognizers = <NSArray: 0x60000214e3a0>; layer = <CALayer: 0x600002f8aca0>>
[native] Manifest does not exist - creaTing a new one.
(null)
[JavaScript] You are Now in the SPLASH PAGE
[JavaScript] You are Now in the LOGIN PAGE
[JavaScript] You are Now in the LOGIN PAGE
2.从新项目开始 => 白屏和错误
我试图通过从 react-native 网站创建一个新的 react-native 项目来解决这个问题……直到现在,我才出现白屏和一些错误。 (见下文)
地铁控制台:
Invariant Violation: Native module cAnnot be null.
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the Js bundle is corrupt or there is an early initialization error when loading React Native.
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the Js bundle is corrupt or there is an early initialization error when loading React Native.
XCode 控制台:
flipper: FlipperClIEnt::addplugin Inspector
flipper: FlipperClIEnt::addplugin Preferences
flipper: FlipperClIEnt::addplugin React
flipper: FlipperClIEnt::addplugin Network
nw_protocol_get_quic_image_block_invoke dlopen libquic Failed
[native] Running application myTestApp ({
initialProps = {
};
roottag = 1;
})
[JavaScript] Invariant Violation: Native module cAnnot be null.
[connection] Socket SO_ERROR [61: Connection refused]
[JavaScript] Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the Js bundle is corrupt or there is an early initialization error when loading React Native.
[connection] nw_socket_handle_socket_event [C5.2:1] Socket SO_ERROR [61: Connection refused]
[connection] nw_connection_get_connected_socket [C5] ClIEnt called nw_connection_get_connected_socket on unconnected nw_connection
TCP Conn 0x6000005c4160 Failed : error 0:61 [61]
[native] Running surface LogBox ({
initialProps = {
};
roottag = 11;
})
[JavaScript] Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the Js bundle is corrupt or there is an early initialization error when loading React Native.
[native] Failed to mount LogBox within 1s
我不知道如何在这个问题上取得进展。
最后,我不得不从 GitHub 存储库下载该项目的先前版本。一切正常。
如果我要使用更新的 npm 包复制项目,我需要在 React-Native 站点上构建最新的 vanilla 版本。 (而不仅仅是复制和粘贴文件,
我个人的教训是不要固执地坚持一周就能解决问题。保持内省的观点并依靠我所知道的有效方法。
以上是大佬教程为你收集整理的React-Native/XCode 12.4/iOS 模拟器 - 应用启动时黑屏全部内容,希望文章能够帮你解决React-Native/XCode 12.4/iOS 模拟器 - 应用启动时黑屏所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。