Skip to content

Instantly share code, notes, and snippets.

@ypsilon-takai
Last active August 29, 2015 14:15
Show Gist options
  • Save ypsilon-takai/d0cf878f0d922e5d87a7 to your computer and use it in GitHub Desktop.
Save ypsilon-takai/d0cf878f0d922e5d87a7 to your computer and use it in GitHub Desktop.

clojurescript 側でreplを実現するためのモジュールっぽい weasel をいじってみました。

手始めにweaselのサンプル

weaselのディレクトリにある、 weasel-example はプロジェクトになってる ようなので、まずは、README.mdに従って動かしてみます。

このサンプルは、Webサーバー側は動かしてないので、ページは直接自分で 開く必要があります。(ちょっとはまった)

weaselをローカルにcloneします。

> git clone git@github.com:tomjakubowski/weasel.git

example のところに移動して、ビルドします。

> pwd
c:/Users/yosi/data/workspace/weasel/weasel-example

> lein deps
> lein cljsbuild once
Successfully compiled "weasel_example.js" in 10.576 seconds.

起動します。

まずはプロジェクトでreplを立ち上げます。僕は cider-jack-in 使います。

> lein repl
nREPL server started on port 49967 on host 127.0.0.1 - nrepl://127.0.0.1:49967
REPL-y 0.3.5, nREPL 0.2.6
Clojure 1.6.0
Java HotSpot(TM) 64-Bit Server VM 1.7.0_51-b13
    Docs: (doc function-name-here)
          (find-doc "part-of-name-here")
  Source: (source function-name-here)
 Javadoc: (javadoc java-object-or-class-here)
    Exit: Control+D or (exit) or (quit)
 Results: Stored in vars *1, *2, *3, an exception in *e

user=> (require 'weasel.repl.websocket)
(cemerick.piggieback/cljs-repl :repl-env (weasel.repl.websocket/repl-env))

nil
user=> << started Weasel server on ws://127.0.0.1:9001 >>
nREPL server started on port 49967 on host 127.0.0.1 - nrepl://127.0.0.1:49967
REPL-y 0.3.5, nREPL 0.2.6
Clojure 1.6.0
Java HotSpot(TM) 64-Bit Server VM 1.7.0_51-b13
    Docs: (doc function-name-here)
          (find-doc "part-of-name-here")
  Source: (source function-name-here)
 Javadoc: (javadoc java-object-or-class-here)
    Exit: Control+D or (exit) or (quit)
 Results: Stored in vars *1, *2, *3, an exception in *e

user=> 

Weaselサーバーを起動します。 ちょっと待つと起動して、cljs.user切り替わります。

user=> (require 'weasel.repl.websocket)
user=> (cemerick.piggieback/cljs-repl :repl-env (weasel.repl.websocket/repl-env))
nil
user=> << started Weasel server on ws://127.0.0.1:9001 >>
Type `:cljs/quit` to stop the ClojureScript REPL
nil
cljs.user=> 

ブラウザ側を立ち上げます。

ブラウザを立ち上げて、プロジェクトの直下にある、index.html を開きます。 四角が一つ入ったページが表示されます。

これで、ブラウザがweaselサーバーにつながった状態になります。

replに何か入れてみます。 ClojuerScriptを実行することができます。

cljs.user=> (.write js/document "<h1> Ping, ping, are you there? </h1>")
nil
cljs.user=> (.write js/document "<h2> This is my first Weasel  </h2>")
nil
cljs.user=> (map #(.write js/document (str "<h2> Count down : " % " </h2>")) (range 5 0 -1))
(nil nil nil nil nil)

こんな画面になります。

スクリーンショット

終了するには、:cljs/quit とします。

cljs.user=> :cljs/quit
;; なんだかエラーメッセージ
<< stopped server >>
:cljs/quit
user=>

chestnut

weaselを調べていたら、chestnutというleiningenのテンプレート?を見つけました。 このテンプレートを使ってnewすると、いろいろお膳立て済みのプロジェクトができあがります。

lein new chestnut try-chestnut

プロジェクトができあがります。 src/cljs/try_chestnut を開いて、replを立ち上げます。

; CIDER 0.8.2 (Java 1.7.0_51, Clojure 1.6.0, nREPL 0.2.6)
try-chestnut.server> 

(run) します。

説明によると、

  • Webサーバーをポート10555で立ち上げて、
  • 自動でcljsやCSSのリロードをしてくれる、Figwheel を立ち上げます。
try-chestnut.server> (run)
Starting figwheel.
Starting web server on port 10555 .
;;=> #<Server org.eclipse.jetty.server.Server@1ef96bd1>
try-chestnut.server> Compiling ClojureScript.

Figwheel: Starting server at http://localhost:3449

Figwheel: Serving files from '(dev-resources|resources)/public'

Compiling "resources/public/js/app.js" from ("src/cljs" "env/dev/cljs")...

WARNING: Use of undeclared Var cljs.core.async/do-alts at line 62 file:/C:/Users/yosi/.m2/repository/org/clojure/core.async/0.1.278.0-76b25b-alpha/core.async-0.1.278.0-76b25b-alpha.jar!/cljs/core/async/impl/ioc_helpers.cljs

WARNING: Bad method signature in protocol implementation, impl/Handler does not declare method called lock-id at line 214 file:/C:/Users/yosi/.m2/repository/org/clojure/core.async/0.1.278.0-76b25b-alpha/core.async-0.1.278.0-76b25b-alpha.jar!/cljs/core/async.cljs

WARNING: Use of undeclared Var cljs.core.async.impl.protocols/lock-id at line 217 file:/C:/Users/yosi/.m2/repository/org/clojure/core.async/0.1.278.0-76b25b-alpha/core.async-0.1.278.0-76b25b-alpha.jar!/cljs/core/async.cljs

WARNING: Bad method signature in protocol implementation, impl/Handler does not declare method called lock-id at line 214 resources\public\js\out\cljs\core\async.cljs

WARNING: Use of undeclared Var cljs.core.async.impl.protocols/lock-id at line 217 resources\public\js\out\cljs\core\async.cljs

Successfully compiled "resources/public/js/app.js" in 16.259 seconds.

notifying browser that file changed:  /js/app.js

notifying browser that file changed:  /js/out/goog/deps.js

notifying browser that file changed:  /js/out/try_chestnut/dev.js

notifying browser that file changed:  /js/out/try_chestnut/core.js

次に、(browser-repl)を実行すると、weaselサーバーがたちあがります。

立ち上がると、cjlsのコンパイルがはじまりました。

try-chestnut.server> (browser-repl)
<< started Weasel server on ws://0.0.0.0:9001 >>

Type `:cljs/quit` to stop the ClojureScript REPL

;;=> nil
cljs.user> Compiling "resources/public/js/app.js" from ("src/cljs" "env/dev/cljs")...

Successfully compiled "resources/public/js/app.js" in 0.228 seconds.

Compiling "resources/public/js/app.js" from ("src/cljs" "env/dev/cljs")...

Successfully compiled "resources/public/js/app.js" in 0.2 seconds.

notifying browser that file changed:  /js/out/try_chestnut/core.js

Compiling "resources/public/js/app.js" from ("src/cljs" "env/dev/cljs")...

Successfully compiled "resources/public/js/app.js" in 0.16 seconds.

Compiling "resources/public/js/app.js" from ("src/cljs" "env/dev/cljs")...

Successfully compiled "resources/public/js/app.js" in 0.224 seconds.

notifying browser that file changed:  /js/out/try_chestnut/core.js

Compiling "resources/public/js/app.js" from ("src/cljs" "env/dev/cljs")...

Successfully compiled "resources/public/js/app.js" in 0.164 seconds.

Compiling "resources/public/js/app.js" from ("src/cljs" "env/dev/cljs")...

Successfully compiled "resources/public/js/app.js" in 0.26 seconds.

notifying browser that file changed:  /js/out/try_chestnut/core.js

これだけです。 ここで、Webサーバーに接続すると、ページが表示されます。

スクリーンショット

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment