Skip to content
rerb edited this page Dec 11, 2014 · 8 revisions

ClojureScript now supports HTML source maps so that you can debug ClojureScript directly in the browser.

Using the bin/cljsc script herein, you can run something like the following on the command line, adjusted for your project:

 $ cljsc src '{:optimizations :whitespace :output-dir "out" :output-to "main.js" :source-map "main.js.map"}'

If you are building using leiningen, a similar section in project.clj would look something like:

 :cljsbuild { 
    :builds [{:id "main"
              :source-paths ["src"]
              :compiler {
                :output-to "main.js"
                :output-dir "out"
                :optimizations :none
                :source-map true}}]})

After compilation, you may then open a HTML file linking to the generated js file in Chrome. Make sure that source maps in Chrome are enabled via the Chrome Developer Tools settings.

Source maps also work with :optimizations set to :none. In this case the :source-map value doesn't control file names. So long as the value is truth-y (cf. the leiningen example above), an individual source map file will be generated for every ClojureScript source file.

It's important to note there are some source map option restrictions when using an :optimizations setting other than :none. In these cases :output-to, :output-dir, and :source-map must all share the exact same parent directory.

Web Server integration

All source files will get copied into :output-dir so that they can be resolved, however this is not useful in the case where you have a web server. :source-map-path can be used to define an arbitrary path prefix. So instead of source map file references resolving to something like resources/public/js/out you can instead instead specify :source-map-path "js/out".

Clone this wiki locally