2014/11/03

[node.js]gruntを使って監視してcoffeescirptをコンパイル

毎回、毎回、コマンドプロンプトを立ち上げてCoffeeScriptをコンパイルするのが、めんどくさくなってきたので、gruntを使って監視コンパイルを試みる。

まずは、下記のコマンドを実行してgrunt-cliをインストール

npm install -g grunt-cli
インストール完了後、コンパイルしたいCoffeeScriptまでディレクトリを移動させます。

今回は、testというフォルダの中にあるtest1にあるtestcoffee1.coffeeというプログラムをコンパイルします。
testディレクトリまで移動した後、「Gruntfile.coffee」と「package.json」の2ファイルを作成します。

その後、package.jsonで下のように記述します。
{
  "name": "coffee",
  "version": "0.0.0",
  "devDependencies": {
  }
}
次に、下のコマンドを入力して実行。
npm install grunt --save-dev
npm install grunt-contrib-watch --save-dev
npm install grunt-contrib-coffee --save-dev
するとさっき、作成したpackage.jsonが以下のようになります。
{
  "name": "coffee",
  "version": "0.0.0",
  "devDependencies": {
    "grunt": "^0.4.5",
    "grunt-contrib-coffee": "^0.12.0",
    "grunt-contrib-watch": "^0.6.1"
  }
}
でGrunt.coffeeを下のようにコーディング
module.exports = (grunt)->
    grunt.initConfig
        pkg : grunt.file.readJSON 'package.json'
        watch : 
          files : ["./test1/*.coffee"]
          tasks : "coffee"
        coffee : 
          compile : 
            files : [
              expand : true
              cwd : "./"
              src :  ['test1/*.coffee']
              dest : "./src/"
              ext : ".js"
            ]
        directories:[]
    grunt.loadNpmTasks 'grunt-contrib-coffee'
    grunt.loadNpmTasks 'grunt-contrib-watch'
    grunt.registerTask 'default', ['watch']
    return
最後に、コマンドプロンプトで下記コマンドを実行。
grunt
するとファイルが変更される度に、coffeescriptがコンパイルされます。

ちなみに、上の場合、testフォルダの同列にあるsrcにjsファイルが吐き出されます。

参考
CoffeeScriptのインストールからGruntを使って自動コンパイルするまで

0 コメント:

コメントを投稿