To add a ClojureScript file to your Leiningen project, you’ll want to make a few tweaks to your project directory layout. Initially, your project layout will look something like this:

- hello-world/
  - README.md
  - project.clj
  - src/
    - hello_world/
      - core.clj

(Note that test files and folders are omitted for clarity, but you should definitely write unit tests wherever appropriate.)

Since this default structure is designed around having only one type of source code (Clojure), you’ll want to modify the directory structure slightly, to match the following:

- hello-world/
  - README.md
  - project.clj
  - src/
    - clj/
      - hello_world/
        - core.clj
    - cljs/
- hello_world
  - resources/
    - public/

As you can see, the src folder now has two subfolders, one for each type of source code. You’ll need to add a :source-paths configuration key to your project.clj file to reflect the new location of the Clojure source code (see the example below for what the new project.clj file will look like). You will also need to create a folder in which to place the compiled JavaScript: resources/public is a common choice.

Then, you must add a build entry in the :cljsbuild configuration map in project.clj:

(defproject hello-world "0.1.0-SNAPSHOT"
  :plugins [[lein-cljsbuild "0.2.7"]]
  :dependencies [[org.clojure/clojure "1.4.0"]
                 [org.clojure/clojurescript "0.0-1450"]]
  :source-paths ["src/clj"]
  :cljsbuild {
    :builds [{
      :source-path "src/cljs"
      :compiler {
        :output-to "resources/public/hello.js"
        :optimizations :whitespace
        :pretty-print true}}]})

The :source-path key specifies where the build looks for ClojureScript source files, and the :output-to key of the :compiler option map specifies where the ClojureScript compiler will emit compiled JavaScript files. Other compiler options will be explained in more detail in the next chapter: for now, just use the ones provided.

Finally, write a ClojureScript file! You can start with something very simple, intended to be run in a browser. The following ClojureScript file just declares a namespace, and then prints out “Hello World” using the document.write JavaScript function. Place it in a file named hello.cljs in the src/cljs/hello_world/ folder (named to match the namespace you declared) in your ClojureScript source folder.

(ns hello-world.hello)
(.write js/document "<p>Hello, world!</p>")

Your Leiningen project is now fully configured to compile ClojureScript. Try compiling your ClojureScript by invoking the lein cljsbuild once command from the command line, anywhere inside your Leiningen project folder. You should see a status message about successfully compiling resources/public/hello.js. If you like, you can inspect the emitted JavaScript file: Be aware, though, that it also includes the core ClojureScript runtime and parts of the standard library, so it’s quite long. See the next chapter for details of how this process works.

You might also want to try running lein cljsbuild auto. This will keep a process open that will watch all the *.cljs files in the specified source directories, and whenever one is saved, it will recompile it automatically and replace the output file.

You should also be aware of the lein cljsbuild clean command, which will delete all the compiled JavaScript files. By default, lein-cljsbuild will not recompile a file unless it detects that the file has been changed by comparing timestamps. Sometimes, however, it’s useful to force a recompile by wiping all the compiler output and restarting with a clean slate.