인프런 커뮤니티 질문&답변

김기범님의 프로필 이미지

작성한 질문수

react native에서 nmap 설치 후 Component 'RCTView' re-registered direct event 'topClick' as a bubbling event 에러가 발생합니다

해결된 질문

작성

·

543

·

수정됨

0

react native 0.73.1

node 20.10.0

NMapsMap 3.17.0

npm i https://github.com/zerocho/react-native-naver-map를 사용해서 nmap을 설치했습니다

android 기기에서는 정상적으로 빌드 되는데, ios 시뮬레이터에서는 빌드는 되지만, 아래의 오류가 발생합니다

 

Component 'RCTView' re-registered direct event 'topClick' as a bubbling event

RCTModuleConstantsForDestructuredComponent
    RCTUIManager.m:1533
moduleConstantsForComponentData
__28-[RCTUIManager getConstants]_block_invoke
__NSDICTIONARY_IS_CALLING_OUT_TO_A_BLOCK__
-[__NSDictionaryM enumerateKeysAndObjectsWithOptions:usingBlock:]
-[RCTUIManager getConstants]
-[RCTUIManager constantsToExport]
-[RCTModuleData gatherConstantsAndSignalJSRequireEnding:]
-[RCTModuleData exportedConstants]
facebook::react::RCTNativeModule::getConstants()
facebook::react::ModuleRegistry::getConfig(std::__1::basic_string<char, std::__1::char_traits<char>, std::__1::allocator<char> > const&)
facebook::react::JSINativeModules::createModule(facebook::jsi::Runtime&, std::__1::basic_string<char, std::__1::char_traits<char>, std::__1::allocator<char> > const&)
facebook::react::JSINativeModules::getModule(facebook::jsi::Runtime&, facebook::jsi::PropNameID const&)
facebook::react::JSIExecutor::NativeModuleProxy::get(facebook::jsi::Runtime&, facebook::jsi::PropNameID const&)
facebook::jsi::DecoratedHostObject::get(facebook::jsi::Runtime&, facebook::jsi::PropNameID const&)
facebook::hermes::HermesRuntimeImpl::JsiProxy::get(hermes::vm::SymbolID)
hermes::vm::JSObject::getComputedWithReceiver_RJS(hermes::vm::Handle<hermes::vm::JSObject>, hermes::vm::Runtime&, hermes::vm::Handle<hermes::vm::HermesValue>, hermes::vm::Handle<hermes::vm::HermesValue>)
hermes::vm::CallResult<hermes::vm::HermesValue, (hermes::vm::detail::CallResultSpecialize)2> hermes::vm::Interpreter::interpretFunction<false, false>(hermes::vm::Runtime&, hermes::vm::InterpreterState&)
hermes::vm::Runtime::interpretFunctionImpl(hermes::vm::CodeBlock*)
hermes::vm::Runtime::runBytecode(std::__1::shared_ptr<hermes::hbc::BCProviderBase>&&, hermes::vm::RuntimeModuleFlags, llvh::StringRef, hermes::vm::Handle<hermes::vm::Environment>, hermes::vm::Handle<hermes::vm::HermesValue>)
facebook::hermes::HermesRuntimeImpl::evaluatePreparedJavaScript(std::__1::shared_ptr<facebook::jsi::PreparedJavaScript const> const&)
...
중략
...
std::__1::function<void ()>::operator()() const
invocation function for block in facebook::react::RCTMessageThread::runAsync(std::__1::function<void ()>)
__CFRUNLOOP_IS_CALLING_OUT_TO_A_BLOCK__
__CFRunLoopDoBlocks
__CFRunLoopRun
CFRunLoopRunSpecific
+[RCTCxxBridge runRunLoop]
__NSThread__start__
_pthread_start
thread_start

답변 2

1

김기범님의 프로필 이미지
김기범
질문자

react native를 0.72.8 버전으로 낮춰 해결했습니다

0

안녕하세요, 인프런 AI 인턴입니다.

김기범님, react native에서 NMapsMap을 설치한 후 발생하는 문제에 대해 문의주셨군요.

해당 에러 메시지는 React Native의 RCTView 컴포넌트가 이벤트를 재등록하는 과정에서 문제가 발생했음을 나타냅니다. 일반적으로 이런 종류의 이슈는 네이티브 모듈의 충돌이나 올바르지 않은 설정으로 인해 발생할 수 있습니다.

해결 방법을 몇 가지 제안드리겠습니다:

  1. 라이브러리의 설치와 링크가 올바르게 수행되었는지 확인해주세요. 때때로 자동 링킹이 제대로 이루어지지 않을 수 있으니, react-native link를 실행하여 모든 필요한 설정이 적용되었는지 확인하십시오.

  2. ios 폴더 내에서 pod install을 실행하여 CocoaPods 종속성이 적절히 설치되었는지 확인하세요.

  3. Xcode를 통해 프로젝트 설정을 확인하고, 필요한 경우 Xcode에서 Clean Build을 시도해보세요. (Product > Clean Build Folder)

  4. NMapsMap 라이브러리의 버전 호환성을 확인하고, react native 버전과 호환되는지 검토해보세요. 때로는 특정 버전의 라이브러리가 새로운 버전의 React Native와 호환되지 않을 수 있습니다.

  5. 같은 에러에 대한 해결책을 찾기 위해 GitHub 이슈 트래커나 Stack Overflow와 같은 플랫폼에서 유사한 문제를 경험한 다른 개발자들의 피드백을 찾아보시기 바랍니다.

  6. 최후의 수단으로, node_modules 폴더와 package-lock.json 파일을 삭제한 다음, npm install을 다시 실행해보세요.

만약 여전히 문제가 해결되지 않는다면, 라이브러리의 개발자에게 직접 연락을 취하거나 문제를 등록하여 도움을 요청할 수도 있습니다.

저는 스프링 부트 관련 정보만 제공할 수 있으니, react native 관련 문제에 대해서는 관련 커뮤니티나 문서를 참조하시는 것이 더 큰 도움이 될 것입니다.