FuelPHPでCoffeeScriptのコンパイルにcoffeescript-phpを使う
はじめに
突然ですが、FuelPHPでCoffeeScript使って実装したいと思ったことありませんか?
生のjavascriptよりも簡潔に書けて、javascript特有のバグも起きにくいということからCoffeeScriptで書きたいというケースは少なからずあると思います。
でもCoffeeScriptで実装する際にめんどくさいポイントが2つあると思っていて、
- CoffeeScriptのためにnode.jsやnpmをサーバーにインストールしなければならないこと
- CoffeeScriptのコンパイル
このポイントを解決できるのがcoffeescript-php(https://github.com/alxlit/coffeescript-php)です。
2012年に書かれたものなのですが、これは
- Composerでインストール可能
- PHP単体でCoffeeScriptのコンパイルが可能(node.js、npm不要)
という代物です。そこでcoffeescript-phpを使ってFuelPHPでCoffeeScriptの自動コンパイル機能を簡単に実装してみます。
coffeescript-phpのインストール
FuelPHPにcoffeescript-phpをインストールするにはComposerを使います。FuelPHPには初期からComposerがあるのでそれを利用します。
{ ... "require": { ... "coffeescript/coffeescript": "1.3.1" }, ... }
と追加してからcomposer.phar
があるディレクトリで
$ php composer.phar update
とすればVENDERPATH
配下にインストールされます。(FuelPHPのVENDORPATH
等についてはこちらを参照)
使い方
coffeescript-phpがインストールができるともう使用することができます。
(Composer経由でインストールしたパッケージは、autoload.phpをrequireすれば使用可能になりますし、それがFuelPHPではCOREPATH/bootstrap.phpで記述されているのでほぼ全てのファイルで使用可能になります。)
ここいらがFuelPHPの楽ちんなところですね!
coffeescript-phpでCoffeeScriptファイルからjavascriptファイルを生成するには以下のようにします。
<?php ... // コンパイルを実行したいCoffeeScriptファイルへのフルパス $coffeescript_path = "/path/to/coffeescript_file"; // ファイルの中身を取得 $coffeescript = File::read($coffeescript_path, true); $javascript = CoffeeScript\Compiler::compile($coffeescript); // $javascript にはコンパイル実行結果のjavascriptのコードが文字列で格納されている
あとは出力されたjavascriptのコードをお好きなファイル(例えばpublic/asset/js/
配下とか)に書き出すとかできるようになります。
これを上手いこと使えば、CoffeeScriptの自動コンパイルの仕組みを作ることができます!
では!
余談
ちなみに私はCoffeeScriptを独自拡張したAsset::coffee()
でCoffeescriptのソースを読み込ませると、
- 自動で更新があったのかどうかを判別し、
- 更新があった場合は
public/asset/js/
配下にjavascriptファイルを設置して、 Asset::js()
と同じようにHTMLのソースに貼っつける
という仕組みを作れました。(作った拡張Assetクラス↓↓)
ROOtKEY/asset.php at master · shirakiya/ROOtKEY · GitHub
このようにcoffeescript-phpは結構使い方によっちゃあ便利になると思います!