俺がtmlib.jsの公式エディタのrunstantをオフライン対応のデスクトップアプリにするの前編
はじめに
この記事は、@kjunichiの2014年パーソナルアドベントカレンダーの19日目の記事です。
ワンライナーでWebアプリのオフライン化に必要な外部依存リソースの洗い出し
これはすごい！3秒でプログラミングが始められるサービス17選 - paiza開発日誌
これ見て
なんでrunstant入って無いんですか？js系で唯一、日中のPOSTメソッドが使えない環境から自由にコード書ける環境なのに！ / “これはすごい！3秒でプログラミングが始められるサービス17選” http://t.co/NJdzJ9t3d0
— kjunichi (@kjunichi) 2014, 12月 4
とくすぶっていた。
Node.js - ネット接続がなくてもOK！3秒でJavaScriptプログラミングが始められるデスクトップアプリを作る方法 - Qiita
はい、これでもうやるしかなくなった！
という事で、tmlib.jsの公式エディタをAtom Shellでオフラインアプリ化を試みることにした。
runstantのビルド
gruntを触ることに
package.jsonがあったので、
npm install
grunt
駄目だった。
npm install -g grunt-cli
そういえば、毎度ことあるごとにGruntの入門記事的なの読んではこれをやってるなぁ。
grunt
出来た！
CDNなリソースのローカル化
runstantが発表されてすぐに、コマンドラインツール作るくらいなので、片手間なりにCDNなリソース使ってることくらいは把握済み。
なので、これをローカルに持ってこないと、真のオフラインアプリにならないという訳。
CDNなリソースの洗い出し
要は、
<script src="http://kjunichi/sugoi.resource">
みたいな箇所を探せばいいはず。
コードの検索といったら
The Platinum Searcher
agのGo言語版で日本語もUTF-8以外も扱える優れもの。
Hombrewなら
brew install pt
一発で簡単インストール
pt "script src" ~/local/src/runstant/
これで、場所はわかった。
CDNリソースをローカルにDL
さっきのデータを整形して、ホスト名をディレクトリにして、保存すれば出来上がり！
pt "script src=\"http" ~/local/src/runstant/ |perl -nle '/=\"http(|s):\/\/(.*?)\"/;print "http".$1."://".$2'|sort -u|wget -i - -nc -x
出来た！
runstantのカスタマイズ
ここまで来たら、http(s)://を取ればOK。
ptでファイル名だけ表示するには以下のようにすればよい
pt -l "script src=\"http"
Perlで文字列置換してファイルを上書く
以下が基本形
perl -pi.bak -e 's/foo/bar/g' *.txt
pt -l "script src=\"http" -l|xargs perl -pi.bak -e 's/src=\"http(|s):\/\//src=\"\/cdn\//g'
後編にづつく to be continued.
