Thursday, May 5, 2016

Ho to run ClojureScript from HTML and JScript pages first 2 steps

I will do step by step  procedure to make first ClojureScript 'Hello World' call  from  HTML/JScript.


  • Step 1 . Create ClojureScript project on local disk

create ClojureScript project by lein ClojureScript artifact creator
lein new mies example
  1.      lein - standard lein repl which must be install on your machine ( see how to install lein) 
  2.      new mies - tell lein to Clojure Script artifact example - name of Clojure Script project
  3.     Navigate to, ./example/src/example and you will find the core.cljs file. Usually, Clojure files have the *.clj extension, but this is ClojureScript, so the extension is *.cljs. Change the contents of core.cljs to read as follows.:

(ns example.core)

(defn ^:export totallyrandomnumber[]
 ;;only returning 42
 (+ 40 2))
What the strange in this>? The namespace for our function is example.core it's normal. The odd looking command, ^:export, tells Google’s compiler to leave the function’s name available instead of optimizing that too. In some languages this would be the equivalent of making the function public or extern‘ing it. Google compiler used to generate example.min.js . Yes finally we call JScript function not ClojureScript!



  •       To compile all this ClojureScript, issue the following command from inside the root of the project. That is the same directory that the src folder sits in. Don’t make the common mistake of entering this command from the same directory that you created the example project in. You have to be in the example folder to successfully build the example project.

  • lein cljsbuild once
    
    If the cljbuild plugin was not setup you will see the message : "'cljsbuild' is not a task. See 'lein help'." do this 2 steps to stay away from this error:

    1.  Step 1 . Add plugin dependency to :plugins property in project.cls file in your project folder. (Important use version 1.1.1 . Version 1.1.0 give error):

    2. [lein-cljsbuild "1.1.1"]

    3. Step 2. Add task itself:
    :cljsbuild {:builds {:prod {;; where your code is
                                :source-paths ["src"]
                                ;; do build this when making a jar
                                :jar true
                                ;; the same compiler options as above
                                :compiler {:output-to "out/main.js"
                                           :optimizations :advanced}}}} 
    
    After that try to re-run:
    lein cljsbuild once
    
    This command creates the all-important minimized JavaScript file from our ClojureScript project. You will find it in the out-adv directory. It is the file called, main.js.
    PS. this goal not always working in production profile. In my case when I used it for Google visualisation package it dosn't work . see this blog about this bug: https://github.com/bodil/cljs-noderepl/issues/17

    • Step 2 . Call ClojureScript function from HTML

    
      
        
        
      
    
    
    This web page is about as barebones as a web page can be. The body contains one script tag that imports the minimized JavaScript file we just compiled. The other script tag contains a JavaScript alert() that incorporates a call to our ClojureScript function. Notice that the fully qualified name of the function is used. That means that the namespace is prepended to the function name so the call looks like: example.core.totallyrandomnumber().

    If you want  to see more about how to compile Clojure-Script follow this blog:
    http://www.lispcast.com/building-clojurescript-process

    No comments: