Search code examples
buildlocalhostclojurescripthttpservershadow-cljs

How to handle the new HTTP configuration for shadow-cljs?

I have been using Clojure, ClojureScript, lein, shadow-cljs, Emacs, and CIDER to work on a Clojure/ClojureScript dynamic web app project.

Usually, I build the project by executing the command cider-jack-in-cljs in Emacs, choosing shadow-cljs, then shadow for REPL type, and, finally, app for the building option.

Things were working fine. I was used to watching changes on the UI on localhost:3005.

But, an answer from a previous question indicated that the project was using an old (and deprecated) HTTP configuration for shadow-cljs.

On shadow-cljs.edn we had:

{:source-paths ["src" "dev"]

 :dependencies ...omitted..

 :nrepl        {:port 8230
                :nrepl-middleware [dirac.nrepl/middleware]}

 :builds       {:app {
                      :devtools {:after-load  app.core/main
                                 :http-root   "public"
                                 :http-port   3005
                                 :preloads    [shadow.cljs.devtools.client.hud
                                               day8.re-frame-10x.preload
                                               dirac.runtime.preload
                                               devtools.preload]}

}}}}}

After the build was complete, I would see the live application on localhost:3005. The mini-buffer would direct me to see the rendered page on the browser.

On shadow-cljs.edn, now, we have:

{:source-paths ["src" "dev"]

 :dependencies ...omitted..

 :nrepl        {:port 8230
                :nrepl-middleware [dirac.nrepl/middleware]}

 :builds       {:app {
                      :devtools {:after-load  app.core/main
                                 :preloads    [shadow.cljs.devtools.client.hud
                                               day8.re-frame-10x.preload
                                               dirac.runtime.preload
                                               devtools.preload]}
                      :dev-http {3005 "public"} 
}}}}}

However, the workflow for development is different.

Emacs mini-buffer redirects me on the browser to a different address: http://localhost:9630/dashboard

Also, old localhost:3005 does not work, even though it is mentioned on :dev-http {3005 "public"}.

1 - What is the new workflow to change the code and see the changes?

2 - Why is port localhost:3005 not working anymore even though it is mentioned in the source code?

3 - What is the purpose of the dashboard?

enter image description here

Solution

  • :dev-http is a top-level config. It is not part of a build config. It needs to sit at the same level as :nrepl and :builds.

    {:source-paths ["src" "dev"]

 :dependencies ...omitted..

 :nrepl        {:port 8230
                :nrepl-middleware [dirac.nrepl/middleware]}

 :dev-http {3005 "public"} 

 :builds
 {:app
  {...
   :devtools
   {:after-load  app.core/main
    :preloads
    [day8.re-frame-10x.preload
     dirac.runtime.preload
     devtools.preload]}}}}}}