Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save ampersanda/c4bb8d662a1be81ee978153ff2df181a to your computer and use it in GitHub Desktop.
Save ampersanda/c4bb8d662a1be81ee978153ff2df181a to your computer and use it in GitHub Desktop.
Minimal setup to get lein-garden auto-compile and Figwheel auto-load working with Reagent
(ns figwheel-garden.core
(:require
[reagent.core :as r]))
(defn my-app []
[:div
[:h1 "Hello Reagent!"]
[:p "Hello Garden!"]
[:p.my-class "Hello My-Class!"]])
(r/render
[my-app]
(js/document.getElementById "app"))
.
├── project.clj
├── resources
│   └── public
│   └── index.html
└── src
└── figwheel_garden
├── core.cljs
└── styles.clj
<html>
<head>
<link href="css/main.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="app"></div>
<script src="js/out/goog/base.js"></script>
<script src="js/main.js"></script>
<script>goog.require('figwheel_garden.core')</script>
</body>
</html>
(defproject figwheel-garden "0.0.1"
:dependencies [[org.clojure/clojure "1.8.0"]
[org.clojure/clojurescript "1.9.293"]
[reagent "0.6.0"]
[garden "1.3.2"]]
:plugins [[lein-cljsbuild "1.1.4"]
[lein-figwheel "0.5.7"]
[lein-garden "0.3.0"]]
:garden
{:builds [{:source-paths ["src"]
:stylesheet figwheel-garden.styles/style
:compiler {:output-to "resources/public/css/main.css"}}]}
:figwheel
{:css-dirs ["resources/public/css"]}
:cljsbuild
{:builds {:dev {:source-paths ["src"]
:figwheel true
:compiler {:output-to "resources/public/js/main.js"
:output-dir "resources/public/js/out/"}}}})
(ns figwheel-garden.styles
(:require
[garden.def :refer [defstyles]]))
(defstyles style
[:body {:background "#ddd"}]
[:h1 {:color "#f00"}]
[:p {:font "18px \"Century Gothic\", Futura, sans-serif"}]
[:.my-class {:font-size "20px" :background "#ddf"}])
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment