使用HBuilderX开发vue app的时候,在浏览器中不能使用HTML5+的功能,需要在模拟器或者手机上能够达到像在浏览器中的实时预览功能,不能改一个地方npm run build一次,这样就太麻烦了,于是试了试网络地址的方法,完美运行,终于可以愉快的装B了~
步骤
1、vue config中的host改为’0.0.0.0’,启动vuecli项目
2、manifest.json 中 launch_path 填写本机IP加程序端口,例如:http://192.168.1.113:8080/
3、电脑关掉防火墙
4、确认电脑连接到手机之后,在模拟器或者真机上运行就 OJBK 啦~!
这样在编辑器中修改vue的代码,就可以在真机或者模拟器上进行实时预览了。
注意
1、查看本机IP:运行cmd – ipconfig
2、这里不能用 localhost 和 127.0.0.1,否则启动程序的时候会找不到资源
3、安卓模拟器配置查看之前的一篇文章 HBuilderX调试夜神安卓模拟器
4、最终vue打包上线的时候,launch_path 需要改成项目打包之后的路径,vuecli打包之后默认路径是 dist/index.html,这里将 manifest.json 中的 launch_path 改成 dist/index.html 即可
呵呵!!!可算是可以直接在开发的时候直接调HTML5+的功能了~
