cordova应用使用手机调试

对于cordova应用的调试，最方便调试方式仍是做为h5应用在浏览器来调试，调试好了再打包cordova应用和打包apk。然而h5应用时的效果跟最终在安卓手机运行还有少数状况会不同，所以，也须要有能在手机调试的方案

 

首先，打开vue1的如下文件，修改一下，添加调试经常使用的debugger和console.log

 

把vue1的打包配置修改一下，让打包后的js文件尽可能保留原样以方便调试时看

修改webpack的生产环境（prod）配置文件

注释掉如下内容

PS：注释掉的UglifyJsPlugin用于js打包、压缩、混淆

 

PS：上述修改在调试后要改回来

 

而后使用build打包（跟通常打包同样）

 

PS：注意，这次打包输出的js文件名称的随机数不会改变，但实际上文件内容是变了。缘由多是开发的js文件内容没变

 

后面的操做就跟平时同样，最后插上手机开始调试

 

手机调试开始后，打开chrome浏览器（只能chrome，其余ie什么都不行），点开f12调试，而后在此进入远程设备调试工具

最左边找到调试的手机，中间是该设备运行着的程序，最后点右边的inspect开始调试

成功后看到以下界面，就能够开始调试了

PS：此处有多是一个白屏，本博客有解决方式

能够看到能够用debugger打断点，变量值也能看

console.log输出也有效

 

PS：此方法依然比较麻烦，尤为是在修改代码后，vue1要build，拷文件到www，而后cordova run，整体仍是很是费时间，还须要找更好的办法