脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript类库 → vue.js → Vue移动端手机预览调试

Vue移动端项目实现使用手机预览调试操作

 更新时间：2020年07月18日 13:41:38   作者：上官孜然  
这篇文章主要介绍了Vue移动端项目实现使用手机预览调试操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧

最近在开发移动端Vue移动端项目，查了一些资料，这里分享下如何在webpack工具构建下的vue项目，在手机端调试和预览，言归正传。

1.电脑和手机连接到同一个WIFI

a.台式电脑和手机同时链接一个路由器，使用同一个wifi；

b.笔记本也可以直接启用一个wifi，手机链接笔记本wifi也可以；

2.查询本地IP地址

WIN+R，输入cmd回车，打开命令提示符，输入ipconfig，查看本地IPv4；

3.修改本地项目中IP地址

找到项目中config文件夹，下面index.js文件打开；

找到host: ‘localhost', 改为上面本地IPv4地址；

module.exports = {
dev: {
 host: '192.168.0.107', // 原为: hotst: 'localhost'
 }
}

4.制作二维码

借助二维码生成工具修改后项目生成二维码。当然不嫌麻烦，地址栏手动输入也可以。https://cli.im/

5.重新启动项目

重新启动项目，然后浏览器地址输入本机地址http://192.168.0.107:8080 访问项目PC端项目；

然后，手机微信扫描二维码就可以访问啦！

以上这篇Vue移动端项目实现使用手机预览调试操作就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • 使用kbone解决Vue项目同时支持小程序问题

    使用kbone解决Vue项目同时支持小程序问题

    这篇文章主要介绍了使用kbone解决Vue项目同时支持小程序问题，本文通过一个todo的例子跟大家详细介绍,需要的朋友可以参考下
    2019-11-11
  • 详解key在Vue3和Vue2的不同之处

    详解key在Vue3和Vue2的不同之处

    key属性是一个特殊的属性，用于标识每个节点的唯一性。在Vue2.x版本中的key和Vue3.x版本中的key有很大的不同，那么在这篇文章中，我们将会讨论Vue2中的key和Vue3中的key的区别
    2023-04-04
  • vue watch普通监听和深度监听实例详解(数组和对象)

    vue watch普通监听和深度监听实例详解(数组和对象)

    这篇文章主要介绍了vue watch普通监听和深度监听(数组和对象)，文中单独通过代码给大家介绍了vue watch 深度监听的方法，感兴趣的朋友一起看看吧
    2018-08-08
  • vue实现添加与删除图书功能

    vue实现添加与删除图书功能

    这篇文章主要介绍了vue实现添加与删除图书功能，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-10-10
  • Vue通过ref父子组件拿值方法

    Vue通过ref父子组件拿值方法

    今天小编就为大家分享一篇Vue通过ref父子组件拿值方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • Vue使用Three.js创建交互式3D场景的全过程

    Vue使用Three.js创建交互式3D场景的全过程

    在现代Web开发中,通过在页面中嵌入3D场景,可以为用户提供更加丰富和交互性的体验,Three.js是一款强大的3D JavaScript库,它简化了在浏览器中创建复杂3D场景的过程,本文将介绍如何在Vue中使用Three.js,创建一个简单的交互式3D场景,需要的朋友可以参考下
    2023-11-11
  • Vue侧滑菜单组件——DrawerLayout

    Vue侧滑菜单组件——DrawerLayout

    本文介绍一个简单的DrawerLayout（类似Android的DrawerLayout）布局组件的实现，基于Vue.js侧滑菜单组件的实现代码大家通过本文一起学习吧
    2017-12-12
  • Vue实现一种简单的无限循环滚动动画的示例

    Vue实现一种简单的无限循环滚动动画的示例

    这篇文章主要介绍了Vue实现一种简单的无限循环滚动动画的示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2021-01-01
  • Vue实现搜索结果高亮显示关键字

    Vue实现搜索结果高亮显示关键字

    这篇文章主要为大家详细介绍了Vue实现搜索结果高亮显示关键字，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2019-05-05
  • vue elementUI select下拉框设置默认值(赋值)失败的解决

    vue elementUI select下拉框设置默认值(赋值)失败的解决

    这篇文章主要介绍了vue elementUI select下拉框设置默认值(赋值)失败的解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-10-10

最新评论