はじめに
ゆとり世代の中野です。
さっそくチャレンジについて書いていきます。
チャレンジする背景
- Webでは動くがNativeでは動かないが発生した
チャレンジ内容
- やっと解決できたので忘備録として残しておく
やったこと
- 症状
- スプラッシュスクリーンで止まったまま
‣
Error: URL.hostname is not implemented, js engine: hermes
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:95:17 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:141:19 in handleException
at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:39 in handleError
at node_modules/expo/build/errors/ExpoErrorManager.js:25:19 in errorHandler
at node_modules/expo/build/errors/ExpoErrorManager.js:30:24 in <anonymous>
at node_modules/@react-native/polyfills/error-guard.js:49:36 in ErrorUtils.reportFatalError
at node_modules/metro-runtime/src/polyfills/require.js:237:40 in guardedLoadModule
at node_modules/metro-runtime/src/polyfills/require.js:131:23 in metroRequire
at http://192.168.86.121:19000/node_modules/expo/AppEntry.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:216888:3 in global
Invariant Violation: Failed to call into JavaScript module method AppRegistry.runApplication(). Module has not been registered as callable. Registered callable JavaScript modules (n = 11): Systrace, JSTimers, HeapCapture, SamplingProfiler, RCTLog, RCTDeviceEventEmitter, RCTNativeAppEventEmitter, GlobalPerformanceLogger, JSDevSupportModule, HMRClient, RCTEventEmitter.
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., js engine: hermes
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:95:17 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:141:19 in handleException
- ... 7 more stack frames from framework internals
Invariant Violation: Failed to call into JavaScript module method AppRegistry.runApplication(). Module has not been registered as callable. Registered callable JavaScript modules (n = 11): Systrace, JSTimers, HeapCapture, SamplingProfiler, RCTLog, RCTDeviceEventEmitter, RCTNativeAppEventEmitter, GlobalPerformanceLogger, JSDevSupportModule, HMRClient, RCTEventEmitter.
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., js engine: hermes
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:95:17 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:141:19 in handleException
- ... 7 more stack frames from framework internals- 原因
URL.hostname is not implement- ReactNativeが
URL.hostnameなどの URL オブジェクトの一部のプロパティやメソッドを全てのバージョンでサポートされていないのが原因 - 対応
- パッケージを追加する
yarn add react-native-url-polyfill- URLを使う場所にimportする
import 'react-native-url-polyfill/auto';
結論
- これでwebと同様にsupabaseを扱えるようになりました
さいごに
- ReactNativeくんさー、君webの技術でしょ。URL Objectぐらい標準でサポートしてよ。
- あと言いたいことはいっぱいあるけどもうちょいエラーメッセージどうにかならん？
yutanakano
WEBエンジニア
大阪生まれのゆとり世代です
趣味はバイクでツーリングに行くこと
愛車は Ninja ZX-25R SE KRT EDITION
Expoでプロダクトを作っています
