This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2021-12-08
Channels
- # adventofcode (49)
- # babashka (21)
- # babashka-sci-dev (12)
- # beginners (250)
- # calva (23)
- # cider (6)
- # clj-kondo (11)
- # cljsrn (8)
- # clojure (129)
- # clojure-europe (50)
- # clojure-france (8)
- # clojure-italy (6)
- # clojure-nl (14)
- # clojure-romania (7)
- # clojure-spec (21)
- # clojure-uk (3)
- # clojurescript (17)
- # conjure (1)
- # core-async (40)
- # core-logic (24)
- # core-typed (7)
- # datavis (2)
- # datomic (2)
- # emacs (29)
- # fulcro (10)
- # graalvm (6)
- # graphql (24)
- # gratitude (6)
- # jobs (1)
- # lsp (9)
- # malli (6)
- # missionary (1)
- # nextjournal (46)
- # off-topic (2)
- # other-languages (3)
- # pathom (5)
- # portal (2)
- # re-frame (37)
- # remote-jobs (1)
- # shadow-cljs (15)
- # spacemacs (9)
- # testing (6)
- # tools-deps (13)
- # vim (32)
- # xtdb (16)
I have a shadow-cljs react native project going and keeping having issues using npm packages I am trying to get the stack navigator to work (though i think i might just end up using bidi) and cant figure out why. I will thread examples:
package.json
{
"name": "UdemyRNChap5",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"@react-native-community/masked-view": "^0.1.11",
"create-react-class": "^15.7.0",
"highlight.js": "11.1.0",
"react": "17.0.2",
"react-native": "0.66.3",
"react-native-gesture-handler": "^2.1.0",
"react-native-reanimated": "^2.3.0",
"react-native-safe-area-context": "^3.3.2",
"react-native-screens": "^3.10.1",
"react-native-unimodules": "^0.14.10",
"react-navigation": "^4.4.4",
"react-navigation-drawer": "^2.7.1",
"react-navigation-stack": "^2.10.4",
"react-navigation-tabs": "^2.11.1",
"shadow-cljs": "^2.16.7"
},
"devDependencies": {
"@babel/core": "^7.16.0",
"@babel/runtime": "^7.16.3",
"@react-native-community/eslint-config": "^3.0.1",
"@testing-library/react-native": "^9.0.0",
"babel-jest": "^27.4.2",
"eslint": "^8.4.0",
"jest": "^27.4.3",
"metro-react-native-babel-preset": "^0.66.2",
"react-test-renderer": "17.0.2"
},
"jest": {
"preset": "react-native"
}
}
shadow-cljs.edn
;; shadow-cljs configuration
{:source-paths
["src"]
:test-paths ["test"]
:dependencies
[[org.clojure/clojure "1.10.3"]
[org.clojure/core.async "1.5.640"]
[org.clojure/clojurescript "1.10.891"]
[bidi "2.1.6"]
[reagent "1.1.0"]
[com.rpl/specter "1.1.3"]
[re-frame "1.2.0"]
[day8.re-frame/re-frame-10x "1.2.0"]]
:builds
{:app
{:target :react-native
:init-fn udemy-rn.core/init
:output-dir "app"
:js-options {:js-package-dirs ["node_modules"]}}
:test {:target :node-test
:output-to "target/test/test.js"
:autorun true}}}
source file:
(ns udemy-rn.naviagators.meals-navigator
(:require [udemy-rn.screens.categories-screen.views.categories-screen :refer [categories-screen]]
[udemy-rn.screens.category-meals-screen.views.category-meals-screen :refer [category-meals-screen]]
[udemy-rn.screens.meal-detail-screen.views.meal-detail-screen :refer [meal-detail-screen]]
["react-navigation-stack" :refer [createStackNavigator]]
["react-navigation" :refer [createAppContainer]]))
(def meals-navigator
(createAppContainer
(createStackNavigator {:categories categories-screen
:category-meals {:screen category-meals-screen}
:meal-details meal-detail-screen})))
error:
Execution error (TypeError) at (<cljs repl>:1).
undefined is not an object (evaluating 'shadow.js.shim.module$react_navigation.createAppContainer')
too much code sorry i can't help via slack. Did you check any examples with react navigation available and see if u are missing something? I dont know where but to me it seems like u are calling non existent object so try to check other working examples and to inspect navigator object to see what in it actually
@U45SLGVHV it ended up being cd ios && pod install
that made the difference for me
and then I found some more errors and concluded with
(def meals-navigator
(let [categoriesScreen (r/reactify-component categories-screen)
categoryMealsScreen (r/reactify-component category-meals-screen)
mealDetailScreen (r/reactify-component meal-detail-screen)]
(createAppContainer
(createStackNavigator ^js (-> {:Categories categoriesScreen
:categoryMeals {:screen categoryMealsScreen}
:mealDetails mealDetailScreen}
(clj->js))))))