[Emacs] OSX 에서 Node.js 와 Slime 연동

Slime 이 무엇인지 Emacs 를 사용하시는 분들은 대충 아시리라 봅니다. REPL (Read Eval Print Loop)형태를 지원하는 언어에 대한 최적의 개발 환경이라고 보시면 됩니다. (물론 부정하는 분들도 많습니다) 

저는 Common Lisp , Clojure 등을 Slime 을 이용해서 개발환경을 구축해 두었습니다. 이번에 프로젝트를 Node.js 로 진행하게 되어서 (Node.js 또한 REPL 을 지원합니다) Emacs + Slime 으로 환경을 구축할려고 알아보았습니다. 

역시나 괜찮은 솔루션이 하나 등장하더군요. https://github.com/swank-js/swank-js

Slime 은 Swank 라는 방식으로 각기 언어별로 소켓 접속이 가능한 방식으로 서버를 띄우면 Emacs 에서 slime-connect 를 이용하여 서버에 붙어서 정보를 가져오고 전달하는 방식으로 구동됩니다. 이러한 점 때문에 원격에 swank 서버를 띄워도 마치 local 에 붙는 것처럼 붙어서 동작할 수가 있습니다. 

설치하는 방법 (OSX - Mountain Lion 기준 입니다)

1. Node.JS 와 npm 을 설치합니다. (Ubuntu 설치는 예전 포스트 참조 )

     

 $ sudo port install nodejs 
 $ sudo port install npm 


2. swank-js 설치 합니다. 
       

 $ sudo npm install -g swank-js 


swank-js 는 node.js 로 만들어진 swank 모듈입니다. 위에서 잠깐 언급한 slime 이 접속할 수 있는 서버를 띄워주는 모듈입니다. npm install 시에 -g 옵션을 주면 전역으로 설치하라는  명령입니다. 이제 어디서나 swank-js 명령으로 swank 서버를 띄워줄 수가 있습니다. 

3. SLIME 을 설치해야 할 시간입니다.

$ cd ~/.emacs.d/
$ cvs -d :pserver:anonymous:anonymous@common-lisp.net:/project/slime/cvsroot co slime


위와 같은 방식으로 다운 받는 것이 속도가 가장 빠르더군요. git 사이트는 생각보다 많이 느립니다. 


4. js2-mode 를 받아야 합니다. 

http://code.google.com/p/js2-mode/ 에서 js2-20090723b.el 을 다운 받아서 js2-mode.el 로 이름 변경해서 적당한 곳 (저는  ~/.emacs.d/ 밑에다 가져다 뒀습니다) 에 옮겨두고 byte-compile-file 을 해줍니다. 

Emacs 를 실행하고 
       

M-x byte-compile-file 


로 js2-mode.el 을 지정하면 됩니다. 이때 꼭 명심해야 할 사항은 절대 js2-mode.el 을 버퍼에 올려둔 상태로 컴파일 진행하면 안된다는 것입니다. (올려둔 상태로 컴파일 하면 에러가 발생함)

.emacs 파일을 열고 다음과 같은 내용을 추가해 줍니다. 

       (autoload 'js2-mode "js2-mode" nil t)
       (add-to-list 'auto-mode-alist '("\\.js$" . js2-mode))



5. 적당한 곳에 swank-js 프로젝트를 다운 받습니다. 
       
     

 $ cd ~/work
 $ git clone git://github.com/swank-js/swank-js.git



6. slime-js.el 의 심볼릭-링크 를 만들어 줍니다. 

$ cd ~/.emacs.d/slime/contrib
$ ln -s ~/work/swank-js/slime-js.el slime-js.el
$ cd ~/.emacs.d/
$ ln -s ~/work/swank-js/slime-js.el slime-js.el


7. .emacs 에 slime-js.el 을 require 해주고, 몇가지 추가 설정을 더 해줍니다. 

       (require 'slime-js)
       
       (add-hook 'js2-mode-hook
          (lambda ()
            (slime-js-minor-mode 1)))
       
       (add-hook 'css-mode-hook
          (lambda ()
            (define-key css-mode-map "\M-\C-x" 'slime-js-refresh-css)
            (define-key css-mode-map "\C-c\C-r" 'slime-js-embed-css)))



8. Emacs 를 다시 띄우고 Terminal.app 를 실행하시고 node.js 프로젝트 만들려고 마음 먹은 곳 위치에서 

$ cd ~/work
$ mkdir node-projects
$ cd node-projects
$ swank-js


이렇게 해주면 swank-js 서버가 구동됩니다. swank-js 명령만 쳐도 되는 것은 'sudo npm install -g swank-js' 해 줬기 때문입니다. 

Emacs 에서 

M-x slime-connect


해 주고 기본적으로 127.0.0.1 과 4005 번 포트로 접속 하는 것을 선택해 주시면 됩니다. (Enter x 2 번)

추가로 어떤 기능이 되는지는 https://github.com/swank-js/swank-js 사이트 참조하시면 됩니다.