Fork me on GitHub
#cljsrn
<
2020-04-21
>
dnolen00:04:38

@olivergeorge missed that, fixed - thanks

joshmiller02:04:22

@dnolen I was able to get my fairly non-trivial app ported over to Krell from an old re-natal setup (no shadow-cljs) in about a day. Just involved updating some requires and then the (not CLJS’s fault) good old-fashioned four hours of head-desking to get RN up to 0.62.2. Awesome work.

👍 4
Oliver George06:04:54

Quick sanity check. Am I missing any tricks/affordances for working with npm deps which export default? (using krell so leveraging the unreleased cljs bundle feature)

Oliver George06:04:58

(ns interop.react-native-safe-area-view
  (:require [reagent.core :as r]
            [react-native-safe-area-view :as module]))


(def SafeAreaView (.-default module))
(def safe-area-view (r/adapt-react-class SafeAreaView))

Oliver George07:04:34

Also, anyone have images working with Krill? Can't seem to get it working.

Oliver George07:04:14

Does this seem right?

(defn app []
  [rn/view {:style {:flex 0.4 :align-items "center" :justify-content "center"}}
   [rn/text {:style {:font-size 32}} (str (js/Date.))]
   [rn/image
    {:style      {:width 200}
     :resizeMode "contain"
     :source     (js/require "./logo-primary-colour.png")}]])

Oliver George07:04:35

Also tried this but logo is always nil

(def logo (js/require "./logo-primary-colour.png"))

Shako Farhad08:04:57

This is how I have defined images. I use shadow-cljs.

(def images
  {:splash-img         (js/require "../assets/images/shadow-cljs.png")
   :splash-img-dark    (js/require "../assets/images/shadow-cljs-dark.png")})

dotemacs08:04:30

Hmm, I just tried it @olivergeorge and I’m getting the same. I placed the image in the root directory of the project. And I’m using it like this (copied the image from a shadow project):

(ns awesome-project.core
  (:require [reagent.core :as r]
            [reagent.react-native :as rn]))

(defonce logo-img (js/require "../shadow-cljs.png"))

(defn ^:export -main [& args]
  (r/as-element
   [rn/view {:style {:flex 1 :align-items "center" :justify-content "center"}}
    [rn/image {:source logo-img
               :style {:width 200
                       :height 200}}]
    [rn/text {:style {:font-size 50}} "Hello Krell!"]]))
What happens is this: the space is made on the screen for the image, but image is not displayed. If I comment out the rn/image vector, then the last vector moves up when the code reloads.

jimberlage13:04:50

Where does the emitted JS live? This is getting compiled to something like

const logo_img = require('../shadow-cljs.png');
So it the JS file isn't in one directory from the root, you may have to change the path to something like ../../shadow-cljs.png for metro to find it. Shadow-cljs handles this behind the scenes for ya, krell may not

dotemacs08:04:08

@shakof91 I think this issue is krell specific, not react-native with shadow-cljs specific.

thheller08:04:06

I haven't looked at krell but the paths mights need to be adjusted for it

Shako Farhad08:04:11

What? Mister thheller is here? Thank you for Shadow-cljs! 😄

😎 12
thheller08:04:43

in shadow-cljs the paths are relativ to the output-dir since all files are in that directory and not nested. that might not be true for krell.

thheller08:04:24

shadow-cljs also collects all js/require calls so metro can find them. not sure if krell does this.

Oliver George08:04:14

Thanks guys. At least I’m not missing something obvious.

dnolen13:04:25

@olivergeorge like avoiding the .-default bit? Probably not since Metro never sees the CLJS

dnolen13:04:29

@olivergeorge file an issue for the image problem

dnolen20:04:17

Krell supports assets now, tested REPL and advanced compilation - just wrapped it up so there's probably still some issues. Feedback and reports welcome!

👍 28
cljs 8