用vue.js框架开发了移动端网站,可是我们知道手机浏览器和电脑上的浏览器其实有很大的差异,特别是ios的浏览器,所以我们在做项目的过程中需要不断地用手机去测试网站查看网站才能在做的过程中减少很多不必要的麻烦。那怎么在手机上查看网站呢?试了网上说的方法,自己试了一下,竟然发现不行,然后通过尝试,终于可以了。
一、修改IP地址在vue的根项目文件下,有个config配置文件目录,里面有个【index.js】文件,在(vue开发环境的搭建安装操作手册——七步搞定)这一篇说过,要把端口改一下,现在改的是host路径,怎么改呢?很简单,打开【命令提示符】,输入【ipconfig】,就能查看到本地的ip地址,然后把地址替换原来项目的【localhost】。这里有个前提,就是你手机连上的wifi和你的电脑是使用同一个网络的。
文章图片
二、手机测试在手机浏览器中输入【192.168.0.x:8083】ip地址加上端口,就可以打开了。直接输入地址是一种方法,还有一种方法就是把该地址复制到连接装换成二维码的那些网站转成二维码,只要打开你的微信扫一扫,就可以查看测试了,是不是很简单呢。
文章图片
【vue开发的手机网页如何在手机测试查看】以上是我在开发vue手机网页的过程中遇到的问题。应该注意的是,并不是改了项目localhost地址就可以了,还要再在npm上重新运行一下,如何调出npm?方法就是回到该项目的根目录,然后按住【shift】+右键,输入命令行【cnpm run dev】重新运行一下。
推荐阅读
- vue项目中引入element-ui框架的流程和注意事项
- 好用的vue开发工具和插件——力荐篇
- vue开发微信小程序图标如何引入的问题——已解决
- vue开发环境的搭建安装操作手册——七步搞定
- 计算机病毒–从新手到专业人士
- JavaScript for-in循环详细用法指南
- PHP中的关联数组详细介绍
- 算法(递归函数检查字符串是否是回文)
- Python MySQL 删除表用法指南