Compiling Garden from CLJS files

[kgxsz]

Hi,

I'm currently using Garden and am playing around with co-locating Garden style in the same file as the Reagent component that will use that style.

I have a cljc file containing my main style which requires the cljs file containing the Garden style. I use lein-garden to compile the CSS, but obviously the compiler fails to pull in the cljs file.

I don't know how keen I am on moving my entire cljs tree into cljc, esp. since I'll need to prefix a tonne of stuff with #?(:cljs ... to satisfy the compiler.

Any suggestions on how to approach this would be very appreciated.

Thank you!

[TatriX]

Currently we are using the following trick:

;;; my-project/stylesheet.cljs
(ns my-project.stylesheet
  (:require [cljs.nodejs :as nodejs] [garden.core :as garden))

(nodejs/enable-util-print!)

(defn -main [& args]
  (println (garden/css ['styles])))

(set! *main-cli-fn* -main)

Then in cljsbuild of project.clj

{:id "css"
                        :source-paths ["src"]
                        :compiler {:main my-project.stylesheet
                                   :output-to "resources/public/js/server-side/css.js"
                                   :output-dir "resources/public/js/server-side/"
                                   :target :nodejs
                                   :optimizations :none}}

And finally in scripts of package.json

    "build-css": "lein cljsbuild once css && mkdir -p resources/public/css && npm run css > resources/public/css/app.css",
    "css": "node resources/public/js/server-side/css.js",

So when I want to build styles for production I just run npm run build-css

For development I've simpy add (garden/css) ouput to the inlined style tag in the html body because reagent+figwheel will reload it much faster then lein-garden+figwheel/css.

[noprompt]

@TatriX that's a pretty nice trick thanks for sharing.

Would supporting the :output-to flag for NodeJS be helpful here? I think that's doable.

[TatriX]

Sure, if I still can keep all my styles in cljs files it would be perfect.