This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2019-08-29
Channels
- # aleph (5)
- # announcements (2)
- # bangalore-clj (2)
- # beginners (52)
- # cider (10)
- # cljsrn (1)
- # clojure (160)
- # clojure-dev (24)
- # clojure-europe (3)
- # clojure-france (1)
- # clojure-india (1)
- # clojure-italy (3)
- # clojure-nl (6)
- # clojure-spec (13)
- # clojure-uk (51)
- # clojurescript (45)
- # code-reviews (1)
- # core-async (41)
- # cursive (41)
- # datomic (17)
- # emacs (37)
- # fulcro (42)
- # graphql (7)
- # joker (4)
- # music (1)
- # nrepl (2)
- # off-topic (21)
- # pathom (19)
- # pedestal (12)
- # re-frame (48)
- # reitit (6)
- # rewrite-clj (8)
- # shadow-cljs (41)
- # specter (6)
- # sql (21)
- # tools-deps (8)
- # vim (7)
- # xtdb (27)
I'm trying to connect to the repl in react-native-runtime. The tool I'm using is react-native-cli. Here is the shadow-cljs.edn:
;; shadow-cljs configuration
{:source-paths
["src"]
:dependencies
[[binaryage/devtools "0.9.10" :scope "test"]]
:builds
{:app
{:target :npm-module
:runtime :react-native
:output-dir "target"
:compiler-options {:infer-externs :auto}
:devtools {:autoload true
:async-require true}}}}
index.js
/**
* @format
*/
if (__DEV__) {
require('./target/shadow.cljs.devtools.client.react_native');
require('./target/forg.dev.devtools').install();
}
import { AppRegistry } from 'react-native';
import { Application } from './target/forg.root';
import { name as appName } from './app.json';
AppRegistry.registerComponent(appName, () => Application);
Anyone a clue how to fix this?
@karol.wojcik don't use :npm-module
. use :react-native
@thheller Thank you very much. I think I'm very close to the working solution. Here is the list of steps I'm doing to have REPL/Hot module reloading enabled. Ok I'll post the update since i found partially working solution. 1. git clone https://github.com/FieryCod/forg 2. yarn shadow-cljs watch app 3. ln target/index.js index.js 4. Run emulator 5. jack-in & run yarn start What partially works: REPL - successfully connected but every command results in timeout What does not work at all: Hot reloading - change in cljs file indeed refreshes the application but content remains the same
https://github.com/thheller/reagent-react-native/blob/master/src/main/test/app.cljs#L33-L64
You are a god! Indeed after using this snippet the hot-reloading works like a charm ❤️ Thank you @thheller. What about the REPL? is it doable?
Ok I found an issue. I had nrepl port setup in .edn. @thheller I know that you hear it almost everyday, but I want to thank you for all your effort you put in development & maintenance & support of shadow-cljs. It's pleasure to use it!! You did great job!!
i meet with a problem, when i run shadow-cljs compile app, the my app works ok, but if i use shadow-cljs release app, it outputs error
@haiyuan.vinurs yes that means that you need externs for .props
since it is getting renamed to .$props$
or .Ad
in actual release
(defn register
([key]
(register key nil))
([key options]
(let [get-props
(fn [this]
{::key key
::id (-> this .-state .-id)
:component-id (-> this .-props .-componentId)})
wrapper
(crc #js
{:displayName
(str key "Wrapper")
:getInitialState
(let [id (swap! id-seq-ref inc)]
(fn [] #js {:key key
:id id}))
:componentDidMount
(fn []
(this-as
^js this
(bind-component this)
(swap! mounted-ref
assoc-in [key (-> this .-state .-id)] this)))
:componentWillUnmount
(fn []
(this-as
^js this
(swap! mounted-ref update key dissoc (-> this .-state .-id))))
;; FIXME: forward other lifecycles the same way
:navigationButtonPressed
(fn [params]
(this-as
^js this
(let [{:keys [navigation-button-pressed]}
(get @screens-ref key)
props
(get-props this)]
(js/console.log "navigationButtonPressed"
key
(boolean navigation-button-pressed)
(pr-str props))
(when navigation-button-pressed
(navigation-button-pressed
(js->clj params :keywordize-keys true)
props)))))
:componentDidAppear
(fn []
(this-as
^js this
(js/console.log "componentDidAppear" key)))
:componentDidDisappear
(fn []
(this-as
^js this
(js/console.log "componentDidDisappear" key)))
:render
(fn []
(this-as
^js this
(let [{:keys [render]}
(get @screens-ref key)
props
(get-props this)]
(js/console.log "render" key (pr-str props))
(-> (render props)
(r/as-element)))))})]
(when (not (nil? options))
(set! (.-options wrapper)
(fn [passProps] (clj->js options))))
(register-component key (fn [] wrapper)))))
--------------------------------------------------------------------------------
27 | (fn [this]
28 | {::key key
29 | ::id (-> this .-state .-id)
30 | :component-id (-> this .-props .-componentId)})
---------------------------------^----------------------------------------------
Cannot infer target type in expression (. (.-props this) -componentId)
--------------------------------------------------------------------------------
31 |
32 | wrapper
33 | (crc #js
34 | {:displayName
--------------------------------------------------------------------------------
i recently migrated a reagent based figwheel project to shadow-cljs. shadow-cljs is definitely watching my src directory, recompiling my code, popping up syntax errors in the browser etc. but for some reason my ^:dev/after-load
fn isn't being called, and so my reagent/react components aren't reloaded. any hints for debugging?
(defn ^:dev/after-load re-render
"Re-render the app when figwheel reloads"
[]
(mount-root))
i've also tried explicitly setting {:devtools {:after-load myapp.re-render
in my shadow-cljs.edn
file with no luck.this might be relevant and help? https://code.thheller.com/blog/shadow-cljs/2019/08/25/hot-reload-in-clojurescript.html
apologies for my late reply. i ended up clearing my .shadow-cljs folder when switching some local branches around and then it worked? 🙂
are there any examples of how to use shadow for a chrome extension? Couldn’t seem to find it in the docs
particularly, looking for an example for content scripts, since they cannot load more scripts
some time ago I did chrome extension target, but I doubt it still works haven't worked with chrome-extensions for a while now. https://gist.github.com/hlolli/265b9183566a4c5829d7ee355e3d0998