This plugin requires Grunt ~0.4.0
Install this grunt plugin next to your project's grunt.js gruntfile with: npm install grunt-tfc-datauri
Then add this line to your project's gruntfile.js
gruntfile:
grunt.loadNpmTasks('grunt-tfc-datauri');
Flashのextensionである、「Toolkit for CreateJS」(※以降 TFC )を使用したプロジェクトで、 image画像を大量に使用している場合、スマートフォンでは画像のリクエストが増えてしまい、 3G回線端末などではロードに時間がかかってしまいます。
そこで画像データをdatauriで使用することによってリクエストを大幅に減らし、 ロード時間を短縮するテクニックがあります。
このpluginは、TFCでpublishされたhtml内のvar manifest
jsonに記述されている画像パスに基づき、
画像をbase64化します。
そしてそのデータをhtmlに上書きします。
もしくは任意のファイルに出力します。
TFCによってpublishされたhtmlを上書きする場合
grunt.initConfig({
tfcDatauri: {
testfile:{
file:'./test/tfc_publish_file.html'
}
}
});
html内のmanifest変数部分が、画像パスからdatauriに変わります。
data uri化したデータを任意のファイルに出力します。
grunt.initConfig({
tfcDatauri: {
testfile:{
file:'./test/tfc_publish_file.html',
dest:'./test/manifest.js'
}
}
});
./test/manifest.js
が出力され、ここにdata uri化したデータが記述されます。
optionsの指定で、manifestという変数名を変更できます。
grunt.initConfig({
tfcDatauri: {
testfile:{
file:'./test/tfc_publish_file.html',
dest:'./test/manifest.js',
options:{
log:true,
//処理中のlogをconsoleに表示します
varName:'foo' // var foo =[ ~
//変数名が'manifest'以外の場合はvarNameで指定します。
}
}
}
});
Copyright (c) 2013 Yota Kanke Licensed under the MIT license.