Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unable to mount app on expo 44/react 17 #8

Open
ghost opened this issue Jul 3, 2022 · 2 comments
Open

Unable to mount app on expo 44/react 17 #8

ghost opened this issue Jul 3, 2022 · 2 comments

Comments

@ghost
Copy link

ghost commented Jul 3, 2022

I've been messing about with running fulcro in expo. I've tried a few of the existing fulcro-native apps on github. Nothing seems to work with any recent version of expo 44/45. All get the same errors involving mounting the app.

This morning I started by porting
https://github.com/jgoodhcg/create-expo-cljs-app
SHA: ad3ad15fd8302a11a55223b4b5735deb89360b71 (most recent)

I'm using
com.fulcrologic/fulcro {:mvn/version "3.5.22"}
com.fulcrologic/fulcro-native {:mvn/version "0.0.10"}

`(def APP-NAME "TEST") 4 references
(defonce ^:export FULCRO-APP (native-app/fulcro-app {})) 11 references

(defsc ^:export Root [this props] {} 9 references
(ui-view {} (ui-text {} "HUH?")))
`
(defn ^:export init []
(app/mount! FULCRO-APP Root :none))

I've exhausted my problem solving skills with this one. But I am available to try things if you are interested in investigating. These are the errors that persist across a few versions/setups.

`Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
at (http://localhost:19006/static/js/bundle.js:9625:37)
at ExpoRootComponent (http://localhost:19006/static/js/bundle.js:12858:83)
at div
at http://localhost:19006/static/js/bundle.js:50469:25
at div
at http://localhost:19006/static/js/bundle.js:50469:25
at AppContainer (http://localhost:19006/static/js/bundle.js:42390:24)
console. @ index.js:1
error @ react-native-logs.fx.ts:35
printWarning @ react.development.js:221
error @ react.development.js:197
createElementWithValidation @ react.development.js:2216
eval @ core.cljs:3947
eval @ core.cljs:3989
G__51924__delegate @ components.cljc:109
G__51924 @ components.cljc:100
render @ expo_application.cljc:50
finishClassComponent @ react-dom.development.js:17486
updateClassComponent @ react-dom.development.js:17436
beginWork @ react-dom.development.js:19074
callCallback @ react-dom.development.js:3946
invokeGuardedCallbackDev @ react-dom.development.js:3995
invokeGuardedCallback @ react-dom.development.js:4057
beginWork$1 @ react-dom.development.js:23965
performUnitOfWork @ react-dom.development.js:22777
workLoopSync @ react-dom.development.js:22708
renderRootSync @ react-dom.development.js:22671
performSyncWorkOnRoot @ react-dom.development.js:22294
scheduleUpdateOnFiber @ react-dom.development.js:21882
updateContainer @ react-dom.development.js:25483
(anonymous) @ react-dom.development.js:26022
unbatchedUpdates @ react-dom.development.js:22432
legacyRenderSubtreeIntoContainer @ react-dom.development.js:26021
render @ react-dom.development.js:26104
renderApplication @ renderApplication.js:24
run @ index.js:50
runApplication @ index.js:94
registerRootComponent @ registerRootComponent.tsx:14
com$fulcrologic$fulcro_native$expo_application$render_root @ expo_application.cljc:52
G__29704__2 @ core.cljs:4365
eval @ keyframe_render.cljc:52
com$fulcrologic$fulcro$rendering$keyframe_render$render_BANG_ @ keyframe_render.cljc:52
eval @ application.cljc:257
eval @ application.cljc:111
reset_mountpoint_BANG_ @ application.cljc:322
eval @ application.cljc:332
eval @ application.cljc:302
net$drilling$app$native$mobile$init @ mobile.cljc:7
eval @ VM697:4
./build/index.js.goog.globalEval @ index.js:473
env.evalLoad @ index.js:1417
(anonymous) @ index.js:1677
./build/index.js @ index.js:1677
webpack_require @ bootstrap:789
fn @ bootstrap:100
1 @ index.js:589
webpack_require @ bootstrap:789
(anonymous) @ bootstrap:856
(anonymous) @ bootstrap:856
Show 22 more frames
react-dom.development.js:25059 Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
at createFiberFromTypeAndProps (react-dom.development.js:25059:1)
at createFiberFromElement (react-dom.development.js:25087:1)
at reconcileSingleElement (react-dom.development.js:14053:1)
at reconcileChildFibers (react-dom.development.js:14113:1)
at reconcileChildren (react-dom.development.js:16991:1)
at finishClassComponent (react-dom.development.js:17512:1)
at updateClassComponent (react-dom.development.js:17436:1)
at beginWork (react-dom.development.js:19074:1)
at HTMLUnknownElement.callCallback (react-dom.development.js:3946:1)
at Object.invokeGuardedCallbackDev (react-dom.development.js:3995:1)
at invokeGuardedCallback (react-dom.development.js:4057:1)
at beginWork$1 (react-dom.development.js:23965:1)
at performUnitOfWork (react-dom.development.js:22777:1)
at workLoopSync (react-dom.development.js:22708:1)
at renderRootSync (react-dom.development.js:22671:1)
at performSyncWorkOnRoot (react-dom.development.js:22294:1)
at scheduleUpdateOnFiber (react-dom.development.js:21882:1)
at updateContainer (react-dom.development.js:25483:1)
at react-dom.development.js:26022:1
at unbatchedUpdates (react-dom.development.js:22432:1)
at legacyRenderSubtreeIntoContainer (react-dom.development.js:26021:1)
at render (react-dom.development.js:26104:1)
at renderApplication (renderApplication.js:24:1)
at Object.run (index.js:50:1)
at Function.runApplication (index.js:94:1)
at Module.registerRootComponent (registerRootComponent.tsx:14:1)
at com$fulcrologic$fulcro_native$expo_application$render_root (expo_application.cljc:52:15)
at Function.G__29704__2 [as cljs$core$IFn$invoke$arity$2] (core.cljs:4365:14)
at eval (keyframe_render.cljc:52:32)
at com$fulcrologic$fulcro$rendering$keyframe_render$render_BANG
(keyframe_render.cljc:52:31)
at eval (application.cljc:257:44)
at Function.eval [as cljs$core$IFn$invoke$arity$2] (application.cljc:111:13)
at reset_mountpoint_BANG
(application.cljc:322:39)
at Function.eval [as cljs$core$IFn$invoke$arity$4] (application.cljc:332:13)
at Function.eval [as cljs$core$IFn$invoke$arity$3] (application.cljc:302:5)
at Object.net$drilling$app$native$mobile$init [as init] (mobile.cljc:7:4)
at eval (eval at ./build/index.js.goog.globalEval (index.js:473:1), :4:39)
at eval ()
at Object../build/index.js.goog.globalEval (index.js:473:1)
at Object.env.evalLoad (index.js:1417:1)
at Object. (index.js:1677:1)
at Object../build/index.js (index.js:1677:1)
at webpack_require (bootstrap:789:1)
at fn (bootstrap:100:1)
at Object.1 (index.js:589:1)
at webpack_require (bootstrap:789:1)
at bootstrap:856:1
at bootstrap:856:1
createFiberFromTypeAndProps @ react-dom.development.js:25059
createFiberFromElement @ react-dom.development.js:25087
reconcileSingleElement @ react-dom.development.js:14053
reconcileChildFibers @ react-dom.development.js:14113
reconcileChildren @ react-dom.development.js:16991
finishClassComponent @ react-dom.development.js:17512
updateClassComponent @ react-dom.development.js:17436
beginWork @ react-dom.development.js:19074
callCallback @ react-dom.development.js:3946
invokeGuardedCallbackDev @ react-dom.development.js:3995
invokeGuardedCallback @ react-dom.development.js:4057
beginWork$1 @ react-dom.development.js:23965
performUnitOfWork @ react-dom.development.js:22777
workLoopSync @ react-dom.development.js:22708
renderRootSync @ react-dom.development.js:22671
performSyncWorkOnRoot @ react-dom.development.js:22294
scheduleUpdateOnFiber @ react-dom.development.js:21882
updateContainer @ react-dom.development.js:25483
(anonymous) @ react-dom.development.js:26022
unbatchedUpdates @ react-dom.development.js:22432
legacyRenderSubtreeIntoContainer @ react-dom.development.js:26021
render @ react-dom.development.js:26104
renderApplication @ renderApplication.js:24
run @ index.js:50
runApplication @ index.js:94
registerRootComponent @ registerRootComponent.tsx:14
com$fulcrologic$fulcro_native$expo_application$render_root @ expo_application.cljc:52
G__29704__2 @ core.cljs:4365
eval @ keyframe_render.cljc:52
com$fulcrologic$fulcro$rendering$keyframe_render$render_BANG
@ keyframe_render.cljc:52
eval @ application.cljc:257
eval @ application.cljc:111
reset_mountpoint_BANG
@ application.cljc:322
eval @ application.cljc:332
eval @ application.cljc:302
net$drilling$app$native$mobile$init @ mobile.cljc:7
eval @ VM697:4
./build/index.js.goog.globalEval @ index.js:473
env.evalLoad @ index.js:1417
(anonymous) @ index.js:1677
./build/index.js @ index.js:1677
webpack_require @ bootstrap:789
fn @ bootstrap:100
1 @ index.js:589
webpack_require @ bootstrap:789
(anonymous) @ bootstrap:856
(anonymous) @ bootstrap:856
Show 17 more frames
index.js:1 The above error occurred in one of your React components:

at <anonymous> (http://localhost:19006/static/js/bundle.js:9625:37)
at ExpoRootComponent (http://localhost:19006/static/js/bundle.js:12858:83)
at div
at http://localhost:19006/static/js/bundle.js:50469:25
at div
at http://localhost:19006/static/js/bundle.js:50469:25
at AppContainer (http://localhost:19006/static/js/bundle.js:42390:24)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.
console. @ index.js:1
error @ react-native-logs.fx.ts:35
logCapturedError @ react-dom.development.js:20091
update.callback @ react-dom.development.js:20119
callCallback @ react-dom.development.js:12319
commitUpdateQueue @ react-dom.development.js:12340
commitLifeCycles @ react-dom.development.js:20737
commitLayoutEffects @ react-dom.development.js:23427
callCallback @ react-dom.development.js:3946
invokeGuardedCallbackDev @ react-dom.development.js:3995
invokeGuardedCallback @ react-dom.development.js:4057
commitRootImpl @ react-dom.development.js:23152
unstable_runWithPriority @ scheduler.development.js:469
runWithPriority$1 @ react-dom.development.js:11277
commitRoot @ react-dom.development.js:22991
performSyncWorkOnRoot @ react-dom.development.js:22330
scheduleUpdateOnFiber @ react-dom.development.js:21882
updateContainer @ react-dom.development.js:25483
(anonymous) @ react-dom.development.js:26022
unbatchedUpdates @ react-dom.development.js:22432
legacyRenderSubtreeIntoContainer @ react-dom.development.js:26021
render @ react-dom.development.js:26104
renderApplication @ renderApplication.js:24
run @ index.js:50
runApplication @ index.js:94
registerRootComponent @ registerRootComponent.tsx:14
com$fulcrologic$fulcro_native$expo_application$render_root @ expo_application.cljc:52
G__29704__2 @ core.cljs:4365
eval @ keyframe_render.cljc:52
com$fulcrologic$fulcro$rendering$keyframe_render$render_BANG_ @ keyframe_render.cljc:52
eval @ application.cljc:257
eval @ application.cljc:111
reset_mountpoint_BANG_ @ application.cljc:322
eval @ application.cljc:332
eval @ application.cljc:302
net$drilling$app$native$mobile$init @ mobile.cljc:7
eval @ VM697:4
./build/index.js.goog.globalEval @ index.js:473
env.evalLoad @ index.js:1417
(anonymous) @ index.js:1677
./build/index.js @ index.js:1677
webpack_require @ bootstrap:789
fn @ bootstrap:100
1 @ index.js:589
webpack_require @ bootstrap:789
(anonymous) @ bootstrap:856
(anonymous) @ bootstrap:856
Show 17 more frames
index.js:1 2022-07-03T13:52:28.289Z ERROR [com.fulcrologic.fulcro-native.expo-application:54] - Unable to mount/refresh
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
at createFiberFromTypeAndProps (http://localhost:19006/static/js/bundle.js:40851:21)
at createFiberFromElement (http://localhost:19006/static/js/bundle.js:40879:15)
at reconcileSingleElement (http://localhost:19006/static/js/bundle.js:29850:23)
at reconcileChildFibers (http://localhost:19006/static/js/bundle.js:29910:35)
at reconcileChildren (http://localhost:19006/static/js/bundle.js:32788:28)
at finishClassComponent (http://localhost:19006/static/js/bundle.js:33309:5)
at updateClassComponent (http://localhost:19006/static/js/bundle.js:33233:24)
at beginWork (http://localhost:19006/static/js/bundle.js:34871:16)
at HTMLUnknownElement.callCallback (http://localhost:19006/static/js/bundle.js:19743:14)
at Object.invokeGuardedCallbackDev (http://localhost:19006/static/js/bundle.js:19792:16)
at invokeGuardedCallback (http://localhost:19006/static/js/bundle.js:19854:31)
at beginWork$1 (http://localhost:19006/static/js/bundle.js:39757:7)
at performUnitOfWork (http://localhost:19006/static/js/bundle.js:38569:12)
at workLoopSync (http://localhost:19006/static/js/bundle.js:38500:5)
at renderRootSync (http://localhost:19006/static/js/bundle.js:38463:7)
at performSyncWorkOnRoot (http://localhost:19006/static/js/bundle.js:38086:18)
at scheduleUpdateOnFiber (http://localhost:19006/static/js/bundle.js:37674:7)
at updateContainer (http://localhost:19006/static/js/bundle.js:41275:3)
at http://localhost:19006/static/js/bundle.js:41814:7
at unbatchedUpdates (http://localhost:19006/static/js/bundle.js:38224:12)
at legacyRenderSubtreeIntoContainer (http://localhost:19006/static/js/bundle.js:41813:5)
at render (http://localhost:19006/static/js/bundle.js:41896:10)
at renderApplication (http://localhost:19006/static/js/bundle.js:42623:3)
at Object.run (http://localhost:19006/static/js/bundle.js:42511:82)
at Function.runApplication (http://localhost:19006/static/js/bundle.js:42554:23)
at Module.registerRootComponent (http://localhost:19006/static/js/bundle.js:12801:87)
at com$fulcrologic$fulcro_native$expo_application$render_root (http://localhost:8081/app/com.fulcrologic.fulcro_native.expo_application.js:56:35)
at Function.G__29704__2 [as cljs$core$IFn$invoke$arity$2] (http://localhost:8081/app/cljs.core.js:15234:94)
at eval (http://localhost:8081/app/com.fulcrologic.fulcro.rendering.keyframe_render.js:98:57)
at com$fulcrologic$fulcro$rendering$keyframe_render$render_BANG
(http://localhost:8081/app/com.fulcrologic.fulcro.rendering.keyframe_render.js:99:3)
at eval (http://localhost:8081/app/com.fulcrologic.fulcro.application.js:335:173)
at Function.eval [as cljs$core$IFn$invoke$arity$2] (http://localhost:8081/app/com.fulcrologic.fulcro.raw.application.js:164:169)
at reset_mountpoint_BANG
(http://localhost:8081/app/com.fulcrologic.fulcro.application.js:470:137)
at Function.eval [as cljs$core$IFn$_invoke$arity$4] (http://localhost:8081/app/com.fulcrologic.fulcro.application.js:495:1)
at Function.eval [as cljs$core$IFn$_invoke$arity$3] (http://localhost:8081/app/com.fulcrologic.fulcro.application.js:433:55)
at Object.net$drilling$app$native$mobile$init [as init] (http://localhost:8081/app/net.drilling.app.native.mobile.js:3:55)
at eval (eval at ./build/index.js.goog.globalEval (http://localhost:19006/static/js/bundle.js:6079:12), :4:39)
at eval ()
at Object../build/index.js.goog.globalEval (http://localhost:19006/static/js/bundle.js:6079:12)
at Object.env.evalLoad (http://localhost:19006/static/js/bundle.js:7269:10)
at Object. (http://localhost:19006/static/js/bundle.js:7542:12)
at Object../build/index.js (http://localhost:19006/static/js/bundle.js:7543:30)
at webpack_require (http://localhost:19006/static/js/bundle.js:790:30)
at fn (http://localhost:19006/static/js/bundle.js:101:20)
at Object.1 (http://localhost:19006/static/js/bundle.js:69279:18)
at webpack_require (http://localhost:19006/static/js/bundle.js:790:30)
at http://localhost:19006/static/js/bundle.js:857:37
at http://localhost:19006/static/js/bundle.js:860:10`

@ghost
Copy link
Author

ghost commented Jul 3, 2022

Just some additional info that may be helpful. The above was from the console when opened in browser, here are the errors from expo when opened on Android. There might be something in the slight difference that is instructive.

`Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:145702:23 in error
at node_modules/react/cjs/react.development.js:216:27 in printWarning
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:4599:22 in error
at node_modules/react/cjs/react.development.js:2214:4 in createElementWithValidation
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:21970:49 in updateClassComponent
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:26932:33 in beginWork$1
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:16933:34 in flushSyncCallbackQueue
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:28735:23 in render
at node_modules/react-native/Libraries/ReactNative/renderApplication.js:57:9 in renderApplication
at node_modules/react-native/Libraries/ReactNative/AppRegistry.js:116:11 in runnables.appKey.run
at node_modules/react-native/Libraries/ReactNative/AppRegistry.js:201:4 in runApplication
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:8077:20 in callFunctionReturnFlushedQueue

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

This error is located at:
in Unknown (created by ExpoRoot)
in ExpoRoot
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:145702:23 in error
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:100:8 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:171:4 in handleException
at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:23:8 in handleError
at node_modules/expo-error-recovery/build/ErrorRecovery.fx.js:8:32 in ErrorUtils.setGlobalHandler$argument_0
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:34657:26 in
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:35828:32 in callImmediates
at http://192.168.12.157:19000/build/index.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:8099:20 in flushedQueue`

@Kaspazza
Copy link
Contributor

This was fixed by #10

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant