Haxeを使うための準備


Haxeを快適に使いたい+Sassも快適に使いたい=Grunt使って自動化じゃー!

ってことで、自分用のメモ書き。

とりあえず、Haxe用の設定のみ。そのうちSassの設定加えて整形する。

Haxeの準備

Haxeインストーラーのダウンロード

公式サイトから落として実行。

インストーラーなので特に考える必要なし。

Sublime Text2でHaxeを使う準備

Install PackageからHaxeをインストール。

Install Packageのインストール方法は割愛。

Haxeを使う準備はこれでOK

Gruntの準備

Node.jsのインストール

Gruntインストール前にNode.jsをインストールしておく。

Max OS Xなので、homebrewインストール済みなら

brew install node

Windowsなら公式インストーラーで楽々インストール。

Gruntのインストール

Gruntのインストールと設定は次の箇所を参照

http://qiita.com/svartalfheim/items/3968fd94da05f565d18f
http://yokotakenji.me/log/?p=2747

sudo npm install -g grunt-cli

とりあえずこんだけ。

設定ファイルの準備

インストール後にとりあえず、プロジェクトフォルダに移って設定ファイルを作る

npm init

対話型で設定ファイルを作成。必要項目だけポチポチ入れる。

とりあえずこんな感じ。

{
  "name": "haxe",
  "version": "0.0.0",
  "description": "Haxe Test Project",
  "main": "index.js",
  "bin": {
    "haxe": "main.js"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "wokowa",
  "license": "MIT"
}

で、Gruntモジュールを追加

npm install grunt --save-dev

次に、Haxe用のGruntプラグインを追加

npm install grunt-haxe --save-dev

もう一個、自動監視のためのプラグインも追加する。

npm install grunt-contrib-watch --save-dev

で、package.jsonがこんな感じに出力される。

{
  "name": "haxe",
  "version": "0.0.0",
  "description": "Haxe Test Project",
  "main": "index.js",
  "bin": {
    "haxe": "main.js"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "wokowa",
  "license": "MIT",
  "devDependencies": {
    "grunt": "~0.4.2",
    "grunt-haxe": "~0.1.12",
    "grunt-contrib-watch": "~0.5.3"
  }
}

Gruntの設定

プロジェクトフォルダの直下にgruntfile.jsを作成。

touch gruntfile.js

で、中身を書いていく。

Gruntが無くてもコンパイルは出来るようにしておきたいのでhxmlを準備する。

なお、Sublime Text2を使ってるので、hxmlの名前はbuild.hxml。

-cp src
-debug
-main Main
-js bin/main.js
module.exports = function(grunt) {
	// Plugin load
	grunt.loadNpmTasks('grunt-contrib-watch');
	grunt.loadNpmTasks('grunt-haxe');

	// Initialize
	grunt.initConfig({
		// Haxe config
		haxe : {
			compile : {
				hxml : 'build.hxml'
			}
		},

		// Watch config
		watch : {
			files : 'src/Main.hx',			// Watch file
			tasks : ['haxe:compile']	// Task setting
		}
	});
}

最後にターミナルから

grunt watch

で完了。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です