以这种方式创建 React Native 应用程序有啥问题?

Posted

技术标签:

【中文标题】以这种方式创建 React Native 应用程序有啥问题?【英文标题】:What is wrong with creating a React Native app this way?以这种方式创建 React Native 应用程序有什么问题? 【发布时间】:2017-09-02 19:28:32 【问题描述】:

我正在尝试创建一个基本的 React Native 应用程序。虽然我可以创建项目,但它不会在模拟器中运行。

应用加载后立即退出。如果我删除 node_modules 并执行 npm install 以重新下载所有模块,我将看到应用程序重新加载 javascript。然后当它达到 100% 时,它会立即再次退出。

我用来创建应用程序的步骤如下:

$ react-native init demo1
$ cd demo1
$ react-native run-ios

字面意思就是这样。我正在使用以下版本的工具:

$ node --version
v6.11.2
$ npm --version
3.10.10
$ react-native --version
react-native-cli: 2.0.1
react-native: 0.48.0

完整的日志是here。我做错了什么?


对此进行更多调查,结果发现 Xcode 项目因堆栈跟踪而失败:

2017-09-02 13:03:00.775 [info][tid:main][RCTCxxBridge.mm:188] Initializing <RCTCxxBridge: 0x6080001a2ae0> (parent: <RCTBridge: 0x6000000a1f80>, executor: (null))
2017-09-02 13:03:00.804 [warn][tid:main][RCTBridge.m:114] Class RCTCxxModule was not exported. Did you forget to use RCT_EXPORT_MODULE()?
2017-09-02 13:03:00.825 [info][tid:main][RCTRootView.m:301] Running application r1 (
    initialProps =     
    ;
    rootTag = 1;
)
2017-09-02 13:03:00.960 r1[47802:5600672] -[NSTaggedPointerString unsignedIntValue]: unrecognized selector sent to instance 0xa313434323930327
2017-09-02 13:03:00.977 r1[47802:5600672] *** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '-[NSTaggedPointerString unsignedIntValue]: unrecognized selector sent to instance 0xa313434323930327'
*** First throw call stack:
(
    0   CoreFoundation                      0x000000010e094b0b __exceptionPreprocess + 171
    1   libobjc.A.dylib                     0x000000010cf4a141 objc_exception_throw + 48
    2   CoreFoundation                      0x000000010e104134 -[NSObject(NSObject) doesNotRecognizeSelector:] + 132
    3   CoreFoundation                      0x000000010e01b840 ___forwarding___ + 1024
    4   CoreFoundation                      0x000000010e01b3b8 _CF_forwarding_prep_0 + 120
    5   r1                                  0x000000010c301394 -[RCTMultipartStreamReader emitProgress:contentLength:final:callback:] + 244
    6   r1                                  0x000000010c301b8a -[RCTMultipartStreamReader readAllPartsWithCompletionCallback:progressCallback:] + 1610
    7   r1                                  0x000000010c3514bc -[RCTMultipartDataTask URLSession:streamTask:didBecomeInputStream:outputStream:] + 444
    8   CFNetwork                           0x000000010daf4c51 __88-[NSURLSession delegate_streamTask:didBecomeInputStream:outputStream:completionHandler:]_block_invoke + 51
    9   Foundation                          0x000000010ca543b7 __NSBLOCKOPERATION_IS_CALLING_OUT_TO_A_BLOCK__ + 7
    10  Foundation                          0x000000010ca540bb -[NSBlockOperation main] + 101
    11  Foundation                          0x000000010ca52877 -[__NSOperationInternal _start:] + 627
    12  Foundation                          0x000000010ca4e5fc __NSOQSchedule_f + 198
    13  libdispatch.dylib                   0x0000000111d7605c _dispatch_client_callout + 8
    14  libdispatch.dylib                   0x0000000111d5494f _dispatch_queue_serial_drain + 221
    15  libdispatch.dylib                   0x0000000111d55669 _dispatch_queue_invoke + 1084
    16  libdispatch.dylib                   0x0000000111d57ec4 _dispatch_root_queue_drain + 634
    17  libdispatch.dylib                   0x0000000111d57bef _dispatch_worker_thread3 + 123
    18  libsystem_pthread.dylib             0x000000011210d5a2 _pthread_wqthread + 1299
    19  libsystem_pthread.dylib             0x000000011210d07d start_wqthread + 13
)
libc++abi.dylib: terminating with uncaught exception of type NSException

这是某种错误还是我做的?

【问题讨论】:

【参考方案1】:

这似乎是 0.48 的问题。尝试使用 0.47.1 应该没问题。

react-native init demo1 --version react-native@0.47.1

【讨论】:

【参考方案2】:

此问题已在 RN 0.48.1 中修复。如果您创建一个新项目(截至 2017 年 9 月 4 日),您应该不会遇到此问题。

【讨论】:

以上是关于以这种方式创建 React Native 应用程序有啥问题?的主要内容,如果未能解决你的问题,请参考以下文章

react native 中的 branch.io 自定义事件未触发奖励规则

React Native:无法解析模块 fs

在 React-Native 中获取 FCM 令牌

如何使用 reanimated 2 [REACT-NATIVE] 创建捏合以缩放相机应用程序

【react-native】小结

React Native:登录或注销时如何以编程方式刷新应用程序?