UPDATE: This post now contains obsolete information. Please read the new ClojureScript Quick Start instead
Recently a couple of people have communicated that getting up and running with ClojureScript is challenging. While there’s a book and a number of excellent tutorials, none emphasize what I consider an absolutely minimal setup with a tight feedback loop and a good debugging experience.
This short post will get you from zero to developing source mapped ClojureScript with instant recompiles on file save.
Install Leiningen.
Goto a directory where you want your project to live and run the following on the command line:
lein new mies hello-world
Switch into the newly created ClojureScript project and run the following:
lein cljsbuild auto hello-world
It’ll take a little while for the first build - a second for JVM start up time, a few seconds to compile ClojureScript, and a few seconds to compile the standard library. Don’t worry, if you edit your source file subsequent compiles will be sub second.
Open the provided index.html (at the root of the project directory)
in Google Chrome. Enable source maps by clicking on the View menu and
selecting Developer > Developer Tools. In the bottom right corner of
the Developer Tools pane you should see a gear icon. If you click this
you will get a pane of settings, one of which is Enable JS source
maps. Enable it.
Refresh the browser, select View > Developer Tools > JavaScript
Console. You should see that the console.log references
a line in ClojureScript. If you click the line number displayed to
the right of the log message you will be taken to that line in the
original ClojureScript source.
Now try editing src/hello_world/core.cljs. For example make your file
look like this:
(ns hello-world.core)
(defn foo [a b]
(+ a b))
(. js/console (log "Hello world!" (foo 1 2)))
Save the file. You should see that the file recompiled in under a second. Refresh your browser and you should see your modifications logged.
Happy hacking!