借助Chrome调试ionic(windows环境)

方式1: 在手机上安装好App之后,连接至电脑,借助Chrome浏览器进行调试

安卓手机

• 翻墙

• 手机打开app,并连接电脑,并打开开发者调试

• 打开谷歌浏览器,输入chrome://inspect/#devices 并点击inspect

苹果手机

• ios手机-设置-safari浏览器-高级-web检查器 打开

• 在电脑上安装ios_webkit_debug_proxy和RemoteDebug iOS WebKit Adapter

  github.com/google/ios-… github.com/RemoteDebug…

• 打开cmd remotedebug_ios_webkit_adapter --port=9000

• ios手机打开app,并连接电脑,信任电脑

• 在chrome地址栏输入：chrome://inspect/#devices，在Discover network targets里面增加localhost:9000

以上借助Chrome调试页面会耗费手机性能,如果你的手机是那种便宜的安卓手机.可能打开一个页面都要花费数秒或者卡住

方式2: ionic serve项目启动后,在手机上使用chrome(或者别的浏览器)打开,进行调试

• 首先手机和电脑必须处在同一wifi下面

• 在电脑上执行 ionic serve之后,会暴露一个外部地址(比如External:http://192.168.1.106:8100),

• 在手机上使用chrome打开该地址

    绝大部分样式在用手机浏览器打开与app是一样的,但有些ionic组件样式是不一样,有细节差别
    最终效果还是以打包后的app为准