vue-cli项目用手机预览的方法

第一步:解决在电脑上可以用本机IP地址预览

在vue-cli项目中默认的预览方式是:http://localhost:8080
但是,vue-cli项目想要在手机上预览,首先要解决的问题是:在电脑端预览地址可以修改成这样(http://你电脑本机的IP地址:端口号)并且正常访问。
一般新建的vue-cli项目预览本机地址是不成功的;那么要怎么修改呢?

话不多说,上图
在package.json文件里面添加 --host 0.0.0.0 就可以啦!


vue.png

接着你就可以去把访问地址中的localhost换成你电脑本机的地址了

那么问题来了,怎么获取本机地址呢?


1534210932_看图王.jpg

在电脑的dos窗口中输入ipconfig,其中IPv4 地址就是你本机的ip地址了

第二步:将本机IP预览地址生成个二维码供微信扫码预览

百度搜 索草料二维码 ,把你本机ip的预览地址在里面生成一个二维码,然后就可以用微信扫码预览啦!


1534211133(1).jpg

到这一步其实还有个很重要的地方需要注意的,不然你手机是预览不到的。
那就是,你的电脑和你预览的手机需要在同一局域网内。意思就是可以在同一wifi下进行手机预览

教程到这里就结束了,手机预览其实不复杂,嘻嘻!希望有用

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • “读书不觉已春深,一寸光阴一寸金,不是道人来引笑,周情孔思正追寻。” 我们在2月的最后一天相逢,却又要在4月22日...
    兰桂腾芳阅读 3,873评论 0 0
  • 不知觉间,发现自己已经1个人度过好几个月了,一个人吃饭、睡觉、洗漱、洗澡、做饭,一个人住一个大房子,一个人逛街买东...
    渡河6号阅读 760评论 0 0
  • Linux操作系统的hostname是一个kernel变量,可以使用如下两种方式查看 和 临时修改主机名 newn...
    风中麦田守望者阅读 2,481评论 0 1
  • 他和她,结缘于网络。认识的时候,他想:网络的世界真好,能让在地球上的人,不管在哪,都可以相逢。 聊着聊着,就撩上了...
    小考拉俱乐部阅读 2,286评论 0 0
  • 十天前,我参加深圳读书会组织的陈立飞书的分享活动,写了一篇《酷先生的读书观》。那是第一次在文章中写到崔大哥,当时有...
    林潇Ena阅读 2,967评论 0 0