ClojureScript

ClojureScript 命令列

2018 年 3 月 26 日
Mike Fikes

ClojureScript 現在有一個令人興奮的新命令列功能,稱為 cljs.main,它大幅簡化了許多常見使用案例中 ClojureScript 的使用。在這篇文章中,我們將帶您快速瀏覽一下所引入的功能。

設定 ClojureScript

為了執行這些範例,您需要設定 ClojureScript。您可以使用 clj 命令列工具或下載獨立的 JAR 來完成。

macOS 或 Linux:clj

  1. 安裝 clj 命令列工具。

  2. 在您的工作目錄中,建立一個 deps.edn 檔案,其中包含以下內容

{:deps {org.clojure/clojurescript {:mvn/version "1.10.238"}}}

Windows

  1. 下載 ClojureScript JAR cljs.jar

  2. 將其放在您的工作目錄中。

啟動瀏覽器 REPL

讓我們直接開始!您可以透過執行以下命令來啟動瀏覽器 REPL

clj -M -m cljs.main

在 Windows 上

java -cp cljs.jar cljs.main

當您執行此操作時,REPL 將會啟動,並且會自動啟動瀏覽器以連線回 REPL。

Browser REPL Serving Default index.html

您會在 REPL 終端機中看到以下內容

ClojureScript 1.10.238
cljs.user=>

我們現在處於互動式環境中,能夠控制頁面。請在 REPL 中嘗試以下操作,以在您的瀏覽器中彈出警示視窗

(js/alert "Hello CLJS!")

建立瀏覽器應用程式

現在,讓我們組合一個簡單的瀏覽器式 ClojureScript 應用程式,並探索 cljs.main 編譯您的應用程式原始碼的能力。

請注意,在上一節中,cljs.main 為我們合成產生了一個 index.html。我們需要在目前目錄中為我們的應用程式建立自訂的 index.html

<html>
  <body>
    <canvas id="canvas" width="400" height="300"></canvas>
    <script src="out/main.js"></script>
  </body>
</html>

src/my_app/core.cljs 中加入以下原始碼(如果在 Windows 上,則為 src\my_app\core.cljs)。

(ns my-app.core)

(def ctx (-> js/document
             (.getElementById "canvas")
             (.getContext "2d")))

(defn draw-shape [x y radius color]
  (set! (.-fillStyle ctx) color)
  (.beginPath ctx)
  (.arc ctx x y radius 0 (* 2 Math/PI))
  (.fill ctx))

(draw-shape 150 150 100 "blue")

現在,讓我們使用 cljs.main 先編譯此原始碼(使用 -c),然後在完成後,啟動瀏覽器 REPL(使用 -r),並額外監看我們原始碼中的變更(使用 -w

clj -M -m cljs.main -w src -c my-app.core -r

在 Windows 上

java -cp "cljs.jar;src" cljs.main -w src -c my-app.core -r

請注意,我們也正在將我們的 src 目錄加入類別路徑。

當此啟動時,您應該會在瀏覽器中看到一個藍色的圓圈。

Browser REPL Showing Blue Circle

請嘗試透過繪製其他圓圈來與應用程式互動。例如,請在 REPL 中嘗試以下操作

(my-app.core/draw-shape 350 200 50 "red")
Browser REPL Showing Blue and Red Circle

如果您變更您的原始碼呢?請將 draw-shape 實作中的 2 變更為 1,並重新整理您的瀏覽器。現在,應用程式將會繪製半圓而不是圓圈。

建立 Node 應用程式

在先前的章節中,我們依賴 cljs.main 來建立瀏覽器 REPL 環境。但是,cljs.main 有一個命令列旗標 (-re),可讓您指定替代的 REPL 環境。

例如,如果您已安裝 Node,您可以使用 cljs.main 來啟動 Node 型的 REPL,方法是提供 -re node

clj -M -m cljs.main -re node

在 Windows 上

java -cp cljs.jar cljs.main -re node

如果您這樣做,您將會直接進入 Node 型的 REPL

ClojureScript 1.10.238
cljs.user=> (+ 2 3)
5
cljs.user=> (exists? js/require)
true

讓我們製作一個小型 Node 型應用程式。請將我們的 my-app.core 命名空間的內容替換為

(ns my-app.core)

(defn square [x]
  (* x x))

(defn -main [& args]
  (-> args first js/parseInt square prn))

完成此步驟後,讓我們使用 cljs.main 來執行此應用程式,以在指定的命名空間中執行 -main(使用 -m

clj -M -m cljs.main -re node -m my-app.core 5

在 Windows 上

java -cp "cljs.jar;src" cljs.main -re node -m my-app.core 5

執行此操作將會自動編譯我們的命名空間、啟動 Node,並執行我們的 -main,傳遞我們的命令列引數 5,因此會列印 25

如果我們想要產生一個獨立的 JavaScript 檔案,我們可以將其與 Node 搭配使用來執行相同的操作,該怎麼做?

首先,在 my-app.core 的結尾加入一個協助程式

(set! *main-cli-fn* -main)

現在,我們要編譯一個 simple(使用 -O)組建,以 Node 為目標(使用 -t),指定我們想要最終輸出檔案的位置(使用 -o

clj -M -m cljs.main -t node -O simple -o main.js -c my-app.core

在 Windows 上

java -cp "cljs.jar;src" cljs.main -t node -O simple -o main.js -c my-app.core

有了這個,您可以將 main.js 複製到您想要的任何位置,然後執行

node main.js 5

它會列印 25

在 Nashorn 中執行測試

可以使用 cljs.main 存取內建的 Nashorn 環境,有了它,就不需要任何外部 JavaScript 環境。讓我們使用它來執行一些測試。

首先,為 my-app.core-test 命名空間新增一個新的檔案

(ns my-app.core-test
  (:require
   [my-app.core]
   [clojure.test :refer [deftest is]]))

(deftest square-test
  (is (== 25 (my-app.core/square 5))))

讓我們在 Nashorn 下執行這些測試(藉由指定 -re nashorn)。為了稍微不同地進行操作,讓我們使用 -i 來載入資源,並使用 -e 來評估將啟動我們測試的表單

clj -M -m cljs.main -re nashorn -i src/my_app/core_test.cljs -e "(cljs.test/run-tests 'my-app.core-test)"

在 Windows 上

java -cp "cljs.jar;src" cljs.main -re nashorn -i src\my_app\core_test.cljs -e "(cljs.test/run-tests 'my-app.core-test)"

有了這個,您將會看到

Testing my-app.core-test

Ran 1 tests containing 1 assertions.
0 failures, 0 errors.

其他功能

以上內容帶您快速瀏覽了 cljs.main 中可用的大部分選項。還有其他選項可用,您可以透過執行以下命令來取得這些選項的說明

clj -M -m cljs.main -h

在 Windows 上

java -cp cljs.jar cljs.main -h

幾個可能很有用的有趣選項是 -co-ro。它們提供設定任何編譯器 編譯器選項REPL 選項(在 -co 下)以及特定於 REPL 環境的選項(在 -ro 下)的能力。如果您需要指定 cljs.main 未提供命令列旗標的內容,這些選項可以作為「緊急出口」。

例如,以下操作會套用 :repl-verbose 選項(因此會顯示使用 REPL 時發出的 JavaScript)

clj -M -m cljs.main -co "{:repl-verbose true}" -re node -r

在 Windows 上

java -cp cljs.jar cljs.main -co "{:repl-verbose true}" -re node -r

您可以直接在命令列上指定 EDN,如上所示,或者您可以提供包含 EDN 的檔案名稱。透過此功能,您幾乎可以使用 cljs.main 來執行您想要使用 ClojureScript 編譯器執行的任何操作。

我們希望您覺得新的 cljs.main 功能很有用,並且它簡化了您需要使用 ClojureScript 編譯器完成的許多常見任務!