vue中的H5移动端项目 真机测试配置方式

 更新时间:2022年09月05日 14:37:20   作者:码农键盘上的梦  
这篇文章主要介绍了vue中的H5移动端项目 真机测试配置方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

H5移动端项目 真机测试配置

vue cli2

1.配置网段:(手机和电脑在同一局域网内)

2.在项目中重启命令行(或者cmd)运行 ipconfig 获取到项目在本机运行的ip地址

3.关闭防火墙

4.前端:config文件夹下index.js文件

修改host:为0.0.0.0

修改

axios.defaultsbaseURl = “http://172.20.10.9:8082”

5.后台:indexurl切换为同一局域网的IP地址

6.重启前后端项目手机输入项目地址真机测试!

vue cli4

1.在项目中重启命令行运行ipconfig(如果是ios系统运行ifconfig)获取到项目在本机运行的ip地址

2.在项目的package.json中修改允许访问ip地址(--host 0.0.0.0)

"dev": "webpack-dev-server --host 0.0.0.0 --inline --progress --config build/webpack.dev.conf.js",

3.在手机端打开该ip地址就可以在手机上运行了

http://192.168.1.107:5050/#/

vue h5 真机调试

下载

npm install vconsole

直接在页面引用

import VConsole from "vconsole";
let vConsole = new VConsole();

正常使用console

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。 

相关文章

  • Vue Router实现多层嵌套路由的导航的详细指南

    Vue Router实现多层嵌套路由的导航的详细指南

    在 Vue 应用中,使用 Vue Router 可以轻松实现多层嵌套路由的导航,嵌套路由允许你创建一个多层次的 URL 结构,这在构建具有复杂导航结构的应用程序时非常有用,需要的朋友可以参考下
    2024-10-10
  • vue中axios封装使用的完整教程

    vue中axios封装使用的完整教程

    这篇文章主要给大家介绍了关于vue中axios封装使用的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-03-03
  • Vue动态设置图片时src不生效的原因及解决方法

    Vue动态设置图片时src不生效的原因及解决方法

    这篇文章主要介绍了Vue动态设置图片时src不生效的原因及解决方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-08-08
  • Vue3使用video-player实现视频播放

    Vue3使用video-player实现视频播放

    video-player是一个基于video.js的视频播放器组件,本文主要介绍了Vue3使用video-player实现视频播放,具有一定的参考价值,感兴趣的可以了解一下
    2024-01-01
  • vue组件开发props验证的实现

    vue组件开发props验证的实现

    这篇文章主要介绍了vue组件开发props验证的实现,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-02-02
  • Vue中计算属性未生效:原因、排查与解决过程

    Vue中计算属性未生效:原因、排查与解决过程

    本文将深入探讨计算属性未生效的常见原因,并提供排查和解决方法,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2025-03-03
  • 谈谈VUE种methods watch和compute的区别和联系

    谈谈VUE种methods watch和compute的区别和联系

    本篇文章主要介绍了谈谈VUE种methods watch和compute的区别和联系,具有一定的参考价值,有兴趣的可以了解一下
    2017-08-08
  • ElementUI下拉框选择后不显示值问题及解决

    ElementUI下拉框选择后不显示值问题及解决

    这篇文章主要介绍了ElementUI下拉框选择后不显示值问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-02-02
  • VueCli生产环境打包部署跨域失败的解决

    VueCli生产环境打包部署跨域失败的解决

    这篇文章主要介绍了VueCli生产环境打包部署跨域失败的解决,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • el-date-picker设置日期默认值两种方法(当月月初至月末)

    el-date-picker设置日期默认值两种方法(当月月初至月末)

    这篇文章主要给大家介绍了关于el-date-picker设置日期默认值(当月月初至月末)的相关资料,文中通过代码示例将解决的办法介绍的非常详细,对大家的学习或者工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-08-08

最新评论