Spacemacs で ClojureScript (re-frame) 開発環境をセットアップするまで

![image](https://qiita-image-store.s3.amazonaws.com/0/9619/63ba9e6c-4c24-97a3-ab46-69ae4c17d555.png)

## 対象読者

EmacsでClojureScript開発している人。Spacemacsが気になっている人。Emacsの設定が面倒だと思っている人。

## 動機

Emacsの拡張パッケージ管理は基本的に面倒です。

まずどんな便利パッケージが世の中にあるか知らないと入れようがない上、入れたとしても `.emacs.d/init.el` にパッケージの設定を書かないと割りと使えたものじゃないというのがデフォルトです。

パッケージインストールも `Cask` や `package.el` などありますが、これを使っていくのはやっぱり面倒です。

## Spacemacsの特徴

で、本題の[Spacemacs](https://github.com/syl20bnr/spacemacs)ですが、どんなものかというと、

1. いわゆる、Emacs以外のEmacsenではない (＝Meadowなどのカスタマイズ済みEmacsではない)
   * つまり、素のEmacsと組み合わせて使うものということです。
     * とはいえ、macOSだと [emacs-plus](https://github.com/d12frosted/homebrew-emacs-plus) が推奨されてます。
2. `~/.emacs.d` にありあわせのGitリポジトリ(https://github.com/syl20bnr/spacemacs.git )をチェックアウトして使う。
   * 要するに、ただの巨大なEmacsの設定ファイルを素のEmacsと組み合わせて使いましょうということです。
3. 初回起動時にどんなスタイルが好きか聞かれる。 __太字__ は私の選択です。このエントリでは下記の選択を前提にお話します。
   * 編集スタイルは  __Emacs派__ か Vim 派か？
   * パッケージを __ある程度入れてしまう__ か、最小にするか？
   * __重いがフル機能の補完を有効__ にするか、軽いモードにするか？
4. 設定ファイルは `~/.spacemacs` or `~/.spacemacs.d/init.el` にある。 `~/.emacs.d` は触らない。
5. 3 の回答結果ないし `~/.spacemacs` の記述内容によりEmacs起動時に最新のパッケージを勝手にロードしてきます。 `Cask` とかは別途いらない。
6. Emacsにパッケージをインストールしたい場合、従来のように一つずつパッケージをインストールするのではなく、レイヤーという単位でパッケージ群を追加していきます。

僕もまだ使い始めなのでわかりませんが、 [helm](https://github.com/emacs-helm/helm) などが自動的にいろんな設定が有効な状態で入ってきました。だいたいEmacs使ってて普通に欲しくなるものは入るようです。

## Spacemacsのアレなところ

完全なEmacs初心者からしたらカスタマイズされすぎていて、デフォルトのEmacsとの挙動の違いが色々新鮮というか辛いかもしれません。 

`helm` のせいで `C-x C-f` おしたらワケのわからん表示になるからね。anything.elバリにSpacemacsで始めるEmacsガイドみたいな本の出版が待たれる。

## インストール

https://github.com/syl20bnr/spacemacs みてください。

というのは寂しいので、補足を。

### macOS

emacs-plus をベースにセットアップすれば問題ないです。


### Windows

通常のセットアップでも動いているようには見えるのですが、実際に使おうとすると `find` などがなくてエラーが出たり固まったりするので、 [MSYS2](http://msys2.github.io/) を入れてUnix系のツール群 (`*.exe`) を手に入れ、Emacs上ではそれにパスが通った状態にして使ったほうがいいと思われます。

## 追加でインストールするもの

ClojureScriptを編集するにあたって、とりあえず下記のような感じになってます。

```lisp
   ;; List of configuration layers to load.
   dotspacemacs-configuration-layers
   '(
     ;; ----------------------------------------------------------------
     ;; Example of useful layers you may want to use right away.
     ;; Uncomment some layer names and press <SPC f e R> (Vim style) or
     ;; <M-m f e R> (Emacs style) to install them.
     ;; ----------------------------------------------------------------
     helm
     auto-completion
     better-defaults
     emacs-lisp
     git
     markdown
     html
     javascript
     syntax-checking
     version-control
     clojure
     )
```

`javascript` など書かなくても、実際に `*.js` ファイルを編集しようとしたらそのレイヤーを入れるか聞かれ、Yesと答えると勝手に入っていきます。ゴイスー。

設定ファイルのリロードは `M-m f e R` で行います。

## ClojureScript編集用設定の追加

`.spacemacs` に下記を書いてます。

```lisp
(defun dotspacemacs/user-config ()
  "Configuration function for user code.
This function is called at the very end of Spacemacs initialization after
layers configuration.
This is the place where most of your configurations should be done. Unless it is
explicitly specified that a variable should be set before a package is loaded,
you should place your code here."
  (add-hook 'clojure-mode-hook #'paredit-mode)
  (add-hook 'cider-repl-mode-hook #'paredit-mode)

  (setq cider-cljs-lein-repl
        (concat
         "" ;; cider-cljs-lein-repl
         "(do (require 'figwheel-sidecar.repl-api)
           (figwheel-sidecar.repl-api/start-figwheel!)
           (figwheel-sidecar.repl-api/cljs-repl))"))


  )
```

## re-frame 開発環境を作る

[Leiningen](http://leiningen.org) をインストールしてから下記コマンドでプロジェクトを作成して、

```
$ lein new re-frame myproject +cider
```

そのまま `project.clj` 上で `C-c M-J` (`cider-jack-in-clojurescript`) を押せばre-frameのREPL開発環境のできあがりです。

一通り立ち上がった後、 http://localhost:3449 をブラウザで開けばブラウザを見ながらHTMLを修正したり、SPAを開発したりすることができます。

## 補足

[Spacemacs](https://github.com/syl20bnr/spacemacs) 公式サイトのショートカットキーの `SPC` は `M-m` に読み替えましょう。Evilユーザ向けなのかな？

e.g. `SPC f e R` => `M-m f e R`