【npm】ngrok×browser-syncでデザイナー確認・スマホデバッグ

2018年3月30日

gulp(browser-sync)で開発してたけど、実機テストできない

gulp（browser-sync、gulp-sass、gulp-pug、gulp-pleeease、gulp-plumber）でサクサクコーディング、を旨としているのですが、http://localhost:3000/ってどうやってスマホデバッグするのよと、思っておりました……。

Local by FlyweelというローカルWordpress開発ツールにURL発行機能があるんですが、用はそれと一緒で。

インストール

$ npm i -g ngrok

ngrok起動（3000はお使いのポート番号）

$ ngrok http 3000

で動きます。

で、browser-syncで立ち上げたローカルサーバーなので、キチンとsyncしますので……
他の人に見せるのに使うときは、自分でくるくるスクロールしていると、他の人の画面でもスクロールしてますので注意。

よかったらシェアしてね！