一、eruda 安装

npm install eruda --save

main.js

import eruda from 'eruda'
import UmsApp from 'UmsApp'
if (判断条件 === 'development') {eruda.init()
}

二、 vconsole

1.salesHome.vue

<template><div id="mobilehome"><keep-alive :include="aliveArr"><router-view v-if="isLoad"></router-view></keep-alive><remote-js :src="jsdkUrl" @load="load"></remote-js></div>
</template>
<script>
import { mapState } from 'vuex'
import postMessageWithNative from './mixins/postMessageWithNative'
export default {name: 'saleshome',mixins: [postMessageWithNative],data() {return {jsdkUrl:process.env.NODE_ENV === 'development'? 'https://url/jssdk/flaginfo.jssdk.min.js?debug=true': 'https://url/jssdk/flaginfo.jssdk.min.js',isLoad: false,}},computed: {...mapState(['aliveArr']),},components: {},methods: {load() {this.getuserInfo()},//获取个人信息getuserInfo() {const { token } = this.$route.queryconst _this = thisif (token) {this.isLoad = truethis.$store.dispatch('SET_TOKEN', token)} else {if (fi.isUmsApp()) {fi.ready(function () {UmsApp.action.msession({}, function (err, data) {window.UmsApp = UmsAppconst isApp = true_this.$store.commit('setIsApp', isApp)_this.isLoad = true_this.$store.dispatch('SET_TOKEN', data.token)})})} else {this.isLoad = true}}},},mounted() {},
}
</script><style lang="scss" scoped></style>

2.postMessageWithNative.js


export default {components: {'remote-js': {render(createElement) {const _this = thisreturn createElement('script',{attrs: {type: 'text/javascript', src: this.src},on: {load: function (event) {console.log('load')_this.$emit('load', event)}}});},props: {src: {type: String, required: true}}}}
}

链接: https://blog.csdn.net/qq_36651686/article/details/116653983?utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2_{aggregatepage}first_rank_v2~rank_aggregation-1-116653983.pc_agg_rank_aggregation&utm_term=eruda%E7%9A%84%E4%BD%BF%E7%94%A8&spm=1000.2123.3001.4430.

移动端调试工具 vconsole、eruda 使用方法相关推荐

移动端调试工具vConsole与Eruda
移动端调试工具vconsole与Eruda 1.vconsole 2. Eruda 随着web H5应用的广泛,很多原生软件采用原生+H5混合开发到的模式,对于安卓和IOS原生的app他们有自己的调试 ...
vue3 移动端调试工具vconsole和eruda 及其两种使用方式
tip:eruda和Chrome浏览器的从console台很像,推荐使用方式一:直接引用eruda 官方镜像:GitHub - liriliri/eruda: Console for mobile ...
H5移动端调试工具 vconsole、eruda 使用方法
eruda: 在 index.html 中引入: <script src="//cdn.jsdelivr.net/npm/eruda"></script> ...
h5移动端调试工具vConsole
1.npm使用方法 npm 安装vconsole npm install vconsole -D 在 main.js 中引用 import Vconsole from 'vconsole';const ...
js移动端调试控制台_移动端js调试工具：eruda
通常写前端页面都在Chrome浏览器的开发模式下进行调试,但是写放在移动端的H5页面时,有时候会遇到在Chrome上调试没有问题,但是在手机的浏览器上有问题的情况:或者有些功能只能在特定的容器中才能其 ...
h5/wap端调试、移动端调试 / vconsole、eruda、spy-debugger
关于h5调试一.vconsole,类似小程序的调试工具,可以在手机上看见打印,真机调试h5时,我们只能看alert,但有些内容无法alert,但vconsole能做到,就像谷歌的f12一样用法,页 ...
移动端微信浏览器调试工具整理eruda，微信x5调试工具无法使用，推荐新工具eruda、vconsole和debugxweb
新版本微信x5调试工具,debugtbs.qq.com无法使用,提示不支持切换x5内核推荐新工具eruda和debugxweb.qq.com 目录区别一.移动端 eruda 二.debugxwe ...
Vue CLI + VUE +vConsole/eruda 在移动端进行调试
Vue CLI + VUE +vConsole/eruda 在移动端进行调试 Vue CLI + VUE +vConsole/eruda 在移动端进行调试 eruda vConsole Vue CLI ...
eruda 移动端调试工具
移动端调试工具 eruda

移动端调试工具 vconsole、eruda 使用方法