Fork me on GitHub
#shadow-cljs
<
2018-07-29
>
prabhath621:07:57

How does one get hot code reloading in a shadow-cljs project? I found :after-load app.main/reload! on the home page of shadow-cljs added it to my .edn file, but when i change css property of an element in component the browser does not reflect the change, i had to refresh to get the new styling. Is there something else i am missing here.

lilactown22:07:08

@prabhath6 what does your reload! function do?

prabhath622:07:20

ha, i thought it was some inbuilt function. Do i need add one.

lilactown22:07:42

shadow-cljs does hot code reloading by default, but it needs to know what to run - you can define a function in any ns and then tell shadow-cljs to run that function before or after reloading your code

prabhath622:07:42

thanks, do you have any example that i can refer to. I am completely new to clojurescript and shadow-cljs

lilactown22:07:30

sure. there are a number of examples here: https://github.com/shadow-cljs/examples

lilactown22:07:42

the user guide is also a really good resource: https://shadow-cljs.github.io/docs/UsersGuide.html

lilactown22:07:23

I usually am working with react, so my start! or reload! function usually just re-renders my application

lilactown22:07:28

here’s a really simple example that I just wrote this morning / last night: https://github.com/Lokeh/lilac.town/blob/master/src/lilactown/client/core.cljs

prabhath622:07:29

thanks for the input. I was able get it working. I was rendering my application again in the reload function. But i am not sure if this is the right way to do it.

(defn reload! []
  (r/render
   [some-component]
   (.getElementById js/document "app")))

(defn ^:export main
  []
  (r/render
    [some-component]
    (.getElementById js/document "app")))
Can i make it better or is this good enough.

lilactown22:07:30

Usually I would just call main again in my reload! function so that I don’t have to change it twice 😄

lilactown22:07:40

but that looks good otherwise

prabhath622:07:19

i was thinking the same, abstract it and call it in both the methods. Thanks for help 👍

👍 4
lilactown22:07:42

shadow-cljs does hot code reloading by default, but it needs to know what to run - you can define a function in any ns and then tell shadow-cljs to run that function before or after reloading your code

lilactown22:07:23

I usually am working with react, so my start! or reload! function usually just re-renders my application