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 使用Jade模板写html,stylus写css的方法

    vue 使用Jade模板写html,stylus写css的方法

    这篇文章主要介绍了vue 使用Jade模板写html,stylus写css的方法,文中还给大家提到了使用jade注意事项,需要的朋友可以参考下
    2018-02-02
  • 详解Vue3.0 + TypeScript + Vite初体验

    详解Vue3.0 + TypeScript + Vite初体验

    这篇文章主要介绍了详解Vue3.0 + TypeScript + Vite初体验,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-02-02
  • 在 vue-cli v3.0 中使用 SCSS/SASS的方法

    在 vue-cli v3.0 中使用 SCSS/SASS的方法

    关于如何在 vue-cli v3.0 中使用 SCSS/SASS,这里提供三种方案。感兴趣的朋友通过本文一起学习吧
    2018-06-06
  • Vue.js中用webpack合并打包多个组件并实现按需加载

    Vue.js中用webpack合并打包多个组件并实现按需加载

    对于现在前端插件的频繁更新,我也是无力吐槽,但是既然入了前端的坑就得认嘛,所以多多少少要对组件化有点了解,下面这篇文章主要给大家介绍了在Vue.js中用webpack合并打包多个组件并实现按需加载的相关资料,需要的朋友可以参考下。
    2017-02-02
  • Vue.js中关于侦听器(watch)的高级用法示例

    Vue.js中关于侦听器(watch)的高级用法示例

    Vue.js 提供了一个方法 watch,它用于观察Vue实例上的数据变动。下面这篇文章主要给大家介绍了关于Vue.js中关于侦听器(watch)的高级用法的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
    2018-05-05
  • vue中element 的upload组件发送请求给后端操作

    vue中element 的upload组件发送请求给后端操作

    这篇文章主要介绍了vue中element 的upload组件发送请求给后端操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-09-09
  • 在vue中使用inheritAttrs实现组件的扩展性介绍

    在vue中使用inheritAttrs实现组件的扩展性介绍

    这篇文章主要介绍了在vue中使用inheritAttrs实现组件的扩展性介绍,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-12-12
  • 浅析Vue中渲染函数的使用

    浅析Vue中渲染函数的使用

    在Vue中,渲染函数是一种用于动态生成组件的函数,可以将组件的模板代码编写为JavaScript代码,并在运行时进行渲染,下面我们就来看看它的具体用法吧
    2023-08-08
  • keep-alive不能缓存多层级路由菜单问题解决

    keep-alive不能缓存多层级路由菜单问题解决

    这篇文章主要介绍了keep-alive不能缓存多层级路由菜单问题解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-03-03
  • 分享Vue组件传值的几种常用方式(一)

    分享Vue组件传值的几种常用方式(一)

    这篇文章主要给大家分享的是Vue组件传值的几种常用方式,文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的朋友可以参考一下
    2022-09-09

最新评论