tip：eruda和Chrome浏览器的从console台很像，推荐使用

方式一：直接引用eruda

官方镜像：GitHub - liriliri/eruda: Console for mobile browsers

缺点：首次请求资源很慢

优点：使用简单，比较靠谱

tip：官方有详细的使用教程，但有点难理解……

项目》public》index.html》head中添加：

<script src="https://cdn.jsdelivr.net/npm/eruda"></script>
<script>eruda.init();</script>

方式二：npm安装（推荐）

Git镜像地址：vConsole: vConsole，手机前端开发调试利器

Step1：安装vconsole依赖包

执行命令：npm install vconsole、npm install eruda

Step2：package.json检查

Step3：main.js引入

注意：eruda与vconsole的使用方式不同，eruda需要初始化

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
// 抹平各浏览器的样式差异
import 'normalize.css'
// 引入style样式文件
import './style/index.scss'
// 引入vconsole移动端调试工具
import VConsole from 'vconsole'
import eruda from 'eruda'const vConsole = new VConsole()
eruda.init()createApp(App).use(store).use(router).use(vConsole).mount('#app')
// export default { vConsole }

Step4：移动端查看效果

齿轮图标是eruda

vue3 移动端调试工具vconsole和eruda 及其两种使用方式相关推荐

移动端调试工具vConsole与Eruda
移动端调试工具vconsole与Eruda 1.vconsole 2. Eruda 随着web H5应用的广泛,很多原生软件采用原生+H5混合开发到的模式,对于安卓和IOS原生的app他们有自己的调试 ...
移动端调试工具 vconsole、eruda 使用方法
移动端调试工具 vconsole.eruda 使用方法一.eruda 安装 main.js 二. vconsole 1.salesHome.vue 2.postMessageWithNative.j ...
H5移动端调试工具 vconsole、eruda 使用方法
eruda: 在 index.html 中引入: <script src="//cdn.jsdelivr.net/npm/eruda"></script> ...
移动端页面调试工具 vConsole 与 eruda
起因当我们写 webapp 或者移动端网页时,想要在手机上进行调试是非常困难的事,因为在手机上无法直接看到日志输出.之前的办法是通过 alert 来打印日志,然后一遍一遍的定位问题修改代码.这样实 ...
h5/wap端调试、移动端调试 / vconsole、eruda、spy-debugger
关于h5调试一.vconsole,类似小程序的调试工具,可以在手机上看见打印,真机调试h5时,我们只能看alert,但有些内容无法alert,但vconsole能做到,就像谷歌的f12一样用法,页 ...
上微信怎么同时用计算机,电脑端微信双开，教你两种简单的方法，上手即用！...
原标题:电脑端微信双开,教你两种简单的方法,上手即用! 微信现在已不单单是社交软件了,如今已成了工作必备软件,每天上班微信电脑端一登,传个文件,发个群通知,实在方便. 但是很多人都不止有一个微信号,电 ...
电脑端微信双开，教你两种简单的方法，上手即用！
电脑端微信双开,教你两种简单的方法,上手即用! https://kuaibao.qq.com/s/20181117A0GAZF00?refer=spider 微信现在已不单单是社交软件了,如今已成了工 ...
服务端验证Google Pay订单的两种方式
Google Pay主要支付流程: 1.手机端向服务端发起支付,生成预订单,给手机端返回生成的订单号 2.手机端向Google发起支付(传入本地服务器生成的订单号) 3.Google服务器将支付结果返 ...
移动端怎么让底部固定_移动端排名应该怎么做？两种匹配移动端实战排名干货分享！...
关于移动端优化的问题.最近一些兄弟一直在问我应该怎么做?毕竟现在是手机的时代.绝大部分情况下.PC显得有点鸡肋!在讲移动端排名之前.逆冬先来讲两个容易被大家搞错的问题(移动端). 1.我观察现在的移动 ...

vue3 移动端调试工具vconsole和eruda 及其两种使用方式