weinre（ワイナリー）

便利ツール

端末検証はVagrantでVM作って、

Charles（デバッキングプロキシ）使ってやってます。

ネイティブアプリの検証は、

Charlesを使ってローカルにあるjsやcssなどを置き換えることで検証しています。



表示確認は以上の方法で出来るのですが、

上手く行かなかった時デバッグしようと思ったら、

コンソール見れなかったりで大変です。


weinre（ワイナリー）を使うと、

Webインスペクタをリモートで使えるようになります。

更に楽に検証できるようになるはず！（？）


導入方法が結構簡単だったので、おすすめです笑

以下、自分用メモメモ。

１）weinreをインストール

> npm -g install weinre

いっかい行方不明にしてしまったので、

めんどくさくてグローバル笑

２）weinreサーバを起動

> weinre --boundHost 192.168.0.x[ローカルipアドレス]

３）端末でブックマークレットの登録

  • 開いたら、ページのなかごろにある、textarea内のbookmarkletをコピーする
  • テキトウなページをブックマークする
  • ブックマークのurlを書く所に先程コピーしたbookmarkletをペースト

４）検証したいウェブページを端末で開く

５）そのページで、bookmarkletを登録したブックマークを押す

６）PCブラウザでhttp://192.168.0.x:8080/client/#anonymousを開く

（http://192.168.0.x:8080を開くと一番上にurlがある）

７）見慣れたelementsやconsoleが見れる！


こんな感じです。