プログラマーズ雑記帳

CoffeeScript の Windows 環境におけるインストールとコンパイル方法について書いてみました。

Node.js のインストール

CoffeeScript 自身が JavaScript で書かれているため、 ローカル環境で実行するにはサーバーサイド JavaScript である Node.js が必要になります。

まず、 Node.js の本家のページから Windows 用のインストーラー(node-vX.X.X-x86.msi) をダウンロードします。

• node.js

node-vX.X.X-x86.msi を実行すれば、 Node.js はインストールされます。

CoffeeScript のインストール

CoffeeScript は Node.js のパッケージマネージャーである npm 使ってイントールします。

Node.js をインストールするとスタートメニューに [Node.js command prompt] ができるので、これを起動します。

立ち上げたコンソール上でコマンドを実行してインストールします。

> npm install -g coffee-script

-g(--global) はグローバルインストールのオプションです。
Node.js では CoffeeScript のようにコマンドライン上で起動させたいものは、 グローバルインストールするようです。

インストールすると CoffeeScript のコンパイラーである coffee コマンドと CoffeeScript 版 make といった cake が使えるようになります。

プロキシ環境でのインストール

ネットワークの接続にプロキシを使用している場合は サーバーを設定していないとエラーとなります。

プロキシサーバーを設定するには以下のコマンドを実行します。

npm config set proxy プロキシサーバーのアドレス:ポート番号

> npm config set proxy http://foo.co.jp:8080

私の環境ではプロキシを設定してもまだエラーが発生しました。 さらに次のコマンドを実行するとインストールに成功するようになります。

 > npm config set registry http://registry.npmjs.org/

参考 :

• npmコマンドでプロキシサーバを指定する方法 - 大人になったら肺呼吸
• proxy 環境で npm 使おうとしたら、 Error: socket hang up ≪ ひよっこ。

環境変数の設定

coffee コマンドの実行時に、 コマンドが見つからないといったエラーがでる場合には次のフォルダーが 環境変数 Path に設定されているか確認してください。
特に %AppData%\npm の方はユーザー別の環境変数の方に追加されるので、 設定されていない可能性があります。

パス	格納ファイル
%AppData%\npm	npm でインストールしたパッケージの実行ファイル (coffee.cmd, cake.cmd など)
%ProgramFiles%\nodejs	Node.js の実行ファイル(node.exe) や npm コマンド (npm.cmd)

なお、 [Node.js command prompt] のコンソール上では確実にパスは設定されるようになっています。

CoffeeScript を使ったコンパイル

coffee コマンドを使って CoffeeScript のコードを JavaScript に変換(コンパイル)します。

まず、適当な CoffeeScript のファイルを作成しておきます。
hello.coffee :

alert('Hello World!')

コンパイルには次のようなコマンドを実行します。

coffee -c 入力ファイル

> coffee -c hello.coffee

実行すると hello.coffee と同じフォルダーに hello.js が作成されます。

-c(--compile) がコンパイル用のオプションです。
他のオプションに関しては以下のページに詳しい説明が載っていました。

• CoffeeScript 入門 - プログラム de タマゴ

eshell での coffee コマンドの実行

私はコンソールに Emacs でのシェルモード(eshell) を使っているのですが、 Meadow の場合には eshell 上で coffee コマンドが上手く動きません。
これは coffee.cmd の実体が bat ファイルで、 古いバージョンの eshell では bat ファイルに引数を渡して実行することができないためです。

以下の行を ~/.eshell/alias に追加すると eshell 上でも coffee でコンパイルすることができるようになります。

alias coffee node.exe $APPDATA/npm/node_modules/coffee-script/bin/coffee $*

ちなみに M-x compile などの場合にはそのまま coffee コマンドで実行できます。

前回、 CoffeeScript のインストール方法について説明しました。 今回は CoffeeScript ファイルを Emacs で編集するためのモード(coffee-mode.el) のインストール方法についてです。

パッケージインストール (Emacs Ver. 24.1 以上)

バージョン 24.1 以上の Emacs の場合はパッケージで簡単にインストールすることができます。

[オプション(Options)] メニューの [Manage Emacs Packages] または M-x list-packages でパッケージアーカイブの一覧を開き、 coffee-mode を選んでインストールします。

手動インストール (Meadow)

少し前までは Windows の Emacs といえば、 Meadow といった感じでしたが、 最近は開発が終わったようでベースが Emacs-21.4 のままとなり、ちょっと古くなりました。
しかし、私の場合は GNU Emacs だと日本語入力がうまくいかないので、 Meadow を使い続けています。

この Meadow 用に手動によるインストール方法も紹介します。
coffee-mode.el が Emacs 24 向けのため、 完全には動かないのですが、 コードハイライトとインデントといった最低限のことはできます。

インストール

以下のサイトから coffee-mode.el を取得します。

• defunkt/coffee-mode ･ GitHub

取得の方法はいろいろあるのですが、 zip でダウンロードするのが、一番簡単かなと思います。


解凍後、 coffee-mode.el をパス(load-path)の通ったフォルダーに置いておきます。

ソースの修正

ダウンロードした coffee-mode.el ファイルはそのままだと以下のようなエラーが発生し、 ロードに失敗します。

Invalid escape character syntax

調べたところ、以下の 2 行の正規表現の記述に原因がありました。
347 行目 :

;; Assignment
(defvar coffee-assign-regexp "\\(\\(\\w\\|\\.\\|_\\|$\\)+?\s*\\):")

;; Local Assignment
(defvar coffee-local-assign-regexp "\\(\\(_\\|\\w\\|\\$\\)+\\)\s+=")

"\s" を "\\s " に変更すると、 ロードできるようになります。 (注: s の後はスペース)

;; Assignment
(defvar coffee-assign-regexp "\\(\\(\\w\\|\\.\\|_\\|$\\)+?\\s *\\):")

;; Local Assignment
(defvar coffee-local-assign-regexp "\\(\\(_\\|\\w\\|\\$\\)+\\)\\s +=")

.emacs.el の設定

*.coffee や Cakefile を開いた時に coffee-mode になるように .emacs.el に設定を記述します。

(autoload 'coffee-mode "coffee-mode" "Major mode for editing CoffeeScript." t)
(add-to-list 'auto-mode-alist '("\\.coffee$" . coffee-mode))
(add-to-list 'auto-mode-alist '("Cakefile" . coffee-mode))

coffee mode ではメニューに [CoffeeScript] の項目が追加されます。 ここからどんなコマンドがあるか確認できます。

ただし、 Meadow では ファイルのコンパイル([Compile file]) 以外の機能はほとんど動作しません。
(ちょっと Meadow の使用に限界を感じてきてます)

Microsoft が TypeScript という新言語を発表しました。
CoffeeScript のように JavaScript に変換して使うタイプのものですが、 言語としては、 JavaScript(ECMAScript) で将来予定されている仕様を先取りした 次世代 JavaScript のような感じになっています。

この TypeScript の Windows 環境におけるインストールとコンパイル方法について紹介します。

• Welcome to TypeScript
  

TypeScript は VS2012 のプラグインか Node.js の npm パッケージとしてインストールします。 私が VS2012 を持ってないので、 Node.js を使ったインストール方法を説明します。
ただ、CoffeeScript のインストール とほとんど同じなので、簡単な説明にしています。

Node.js のインストール

Node.js の本家のページから Windows 用のインストーラー(node-vX.X.X-x86.msi) をダウンロードして、実行します。

• node.js

プロキシの設定

プロキシサーバーを設定するには以下のコマンドを実行します。

npm config set proxy プロキシサーバーのアドレス:ポート番号

> npm config set proxy http://foo.co.jp:8080

プロキシを設定してもエラーとなる場合は、 さらに次のコマンドを実行します。

 > npm config set registry http://registry.npmjs.org/

TypeScript のインストール

コマンドを実行して、インストールします。

> npm install -g typescript

インストールすると TypeScript のコンパイラーである tsc ができます。

TypeScript を使ったコンパイル

tsc コマンドを使って TypeScript のコードを JavaScript に変換(コンパイル)します。

まず、適当な TypeScript のファイルを作成しておきます。
hello.ts :

class Greeter {
    greeting: string;
    constructor (message: string) {
        this.greeting = message;
    }
    greet() {
        return "Hello, " + this.greeting;
    }
} 

コンパイルには次のようなコマンドを実行します。

tsc [オプション] 入力ファイル ...

> tsc hello.ts

実行すると hello.ts と同じフォルダーに hello.js が作成されます。
hello.js :

var Greeter = (function () {
    function Greeter(message) {
        this.greeting = message;
    }
    Greeter.prototype.greet = function () {
        return "Hello, " + this.greeting;
    };
    return Greeter;
})();

オプション

tsc のコマンドオプションは -h または引数なしで tsc を実行すると Usage が表示されます。

よく使いそうなのは、次のようなところじゃないかと思います。

オプション	機能
-h, --help	ヘルプ(Usage) 表示
--out	出力ファイル名の指定。複数の入力ファイルからの統合 ex.) tsc --out foo.js foo.ts bar.ts
-w, --watch	スクリプトの変更の監視。
-sourcemap	ソースマップの生成

Emacs での使用

TypeScript を Emacs で使用するための設定の紹介です。
(ちゃんとはできてません)

メジャーモード

Microsoft が TypeScript 用のモードの lisp も一緒に公開している ということでサイトにとりに行きました。

• Sublime Text, Vi, Emacs: TypeScript enabled! - Interoperability @ Microsoft - Site Home - MSDN Blogs

zip ファイルをダウンロードしたところ、中身は readme ファイル 1 つ入っただけ。 ファイルの内容を見てみると、最後の方に 一時的に使えません。もうすぐバージョンアップするよ 的なことが書かれてました。

いろいろツッコミたいところはありますが、とりあえず我慢して待ってみます。
Java や JavaScript のモードで代用すれば、まぁ、わりといけます。

eshell でのコマンドの実行

Meadow の eshell 上で動作させるには、 以下の行を ~/.eshell/alias に追加します。

alias tsc node.exe $APPDATA/npm/node_modules/typescript/bin/tsc $*

コンパイルの設定

M-x compile で Emacs 上でのコンパイルを行うことができます。
その出力結果のハイライトとエラー箇所へのジャンプには出力スタイルが登録されている必要があります。 上手くエラー箇所へジャンプできない場合は以下の記述を .emacs.el に記述してください。

(require 'compile)
(setq compilation-error-regexp-alist
      (append
       '(;; d:/h...ript/sample.ts (13,175):
         ("^\\(.*\\) (\\([0-9]+\\),[0-9]+):" 1 2))
       compilation-error-regexp-alist))

詳しくは以前の記事をご覧ください。

• Emacs でのコンパイルに未対応のコンパイラーへの対処法 | プログラマーズ雑記帳
• yafm.el - コンパイル、 grep を使いやすくする emacs-lisp | プログラマーズ雑記帳