皆さんこんにちは！
皆さんは開発するときになんのPCを使っていますか？？？
僕はお金ないので学校で配布されたWindowsを使用しています。
メモリも4GBとDockerで開発するときは結構止まったりします。
めちゃめちゃMac欲しい。。。
これだけの問題ならいいのですが、何と言っても本番環境のSafariのエラーほど苦しむものはない！
今日はそんなWindowsで開発している方でSafari特有のエラーログをChromeで見る裏技をご紹介します！
Windowsユーザーの皆さん、打倒Safariと行きましょう！！！
セットアップ#
まずはSafariをデバッグするためのセットアップを行いましょう！
iTunesをインストール##
こちらからiTunesをインストールしてください。
iTunesをインストールしないとデバッグできませんのでご注意を
Safariの設定##
お使いのデバイスの「設定」→「Safari」→「詳細」から「Webインスペクタ」を「ＯＮ」にしてください。
scoopのインストール##
次に「scoop」をインストールします。
scoopとはＭａｃで言うHomebrewみたいなものです。
WindowsのPower shellを「管理者として実行」し、下記のコマンドを入力
> Set-ExecutionPolicy RemoteSigned -Scope CurrentUser -Force
iwr -useb get.scoop.sh | iex
gitのインストール##
既にgitコマンドを打てている人はこちらはスルーしてください。
> scoop install git
npmのインストール##
こちらも既にnpmコマンドを打てている方はスルーしてください。
> scoopi install npm
extrasの追加##
> scoop bucket add extras
デバッグ用のパッケージインストール##
ここからは一気に行きます
> scoop install ios-webkit-debug-proxy
> scoop install nodejs
> npm install remotedebug-ios-webkit-adapter -g
これでデバッグを行う準備が整いました。
Safariのデバッグ#
ここらは、iPhoneとWindowsをケーブルで繋いだまま行ってください。
Windowsに接続している状態でSafariでデバッグをしたいページを開いてください。
Power shellで以下のコマンドを実行
> remotedebug_ios_webkit_adapter --port=9221
chrome://inspect/#devicesにアクセス
Configureをクリックし、Target discovery settingsにlocalhost:9221を追加
すると、Remote TargetにSafariで開いたページのURLが表示されます。
下の「inspect」をクリック
そしたら、いつもの通りに開発者ツールでデバッグできます。
いかがだったでしょうか？？？
意外とすんなりとデバッグできることに驚きました。
また、WindowsにもHomebrewみたいな機能があるとは驚き。
みんなでChrome使えば平和なのにな～
以上、「iPhoenのSafariのエラーでしょ？？それ「remotedebug_ios_webkit_adapter」で解決できるよ」でした！
また、何か間違っていることがあればご指摘頂けると幸いです。
他にも初心者さん向けに記事を投稿しているので、時間があれば他の記事も見て下さい！！
あと、最近「ココナラ」で環境構築のお手伝いをするサービスを始めました。
気になる方はぜひ一度ご相談ください！
Thank you for reading