快捷導(dǎo)航

移動(dòng)端（微信等使用vConsole調(diào)試console的方法

更新時(shí)間：2019年03月05日 15:01:40 作者：朱桂彪

這篇文章主要介紹了移動(dòng)端（微信等使用vConsole調(diào)試console的方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

前言

因?yàn)樽罱恢痹谂苿?dòng)端項(xiàng)目，由于在移動(dòng)端無(wú)法打開控制臺(tái)，所以想辦法打印調(diào)試console的數(shù)據(jù)一直苦惱。之前用的是chrome的inspect調(diào)試，但是只能使用移動(dòng)版的chrome查看數(shù)據(jù)，兼容不好，所以最近使用了vConsole 進(jìn)行調(diào)試

使用

廢話不多說(shuō)，說(shuō)說(shuō)怎么使用的吧。

首先去下載相關(guān)的代碼，由于只需要在頁(yè)面引入一個(gè)js文件，直接去下載就可以，地址：請(qǐng)戳我

或者使用 npm 安裝：

npm install vconsole

使用webpack，然后js代碼中

import VConsole from 'vconsole/dist/vconsole.min.js' //import vconsole
let vConsole = new VConsole() // 初始化

或者找到這個(gè)模塊下面的 dist/vconsole.min.js ，然后復(fù)制到自己的項(xiàng)目中

<head>
  <script src="dist/vconsole.min.js"></script>
</head>
<!--建議在 `<head>` 中引入哦~ -->
<script>
 // 初始化
 var vConsole = new VConsole();
 console.log('VConsole is cool');
</script>

結(jié)果

點(diǎn)擊后

證明安裝成功，打開查看你的打印吧。

注意

請(qǐng)注意，VConsole 只是 vConsole 的原型，而非一個(gè)已實(shí)例化的對(duì)象。所以在手動(dòng) new 實(shí)例化之前，vConsole 不會(huì)被插入到網(wǎng)頁(yè)中。

官方文檔：請(qǐng)戳我

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

js實(shí)現(xiàn)開關(guān)燈效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)開關(guān)燈效果,文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-10-10
用Javascript 和 CSS 實(shí)現(xiàn)腳注（Footnote）效果
腳注（Footnote）是向用戶提供更多信息的一個(gè)最佳途徑，也是主體信息的一個(gè)有效補(bǔ)充，常見于各種印刷書籍中。
2009-09-09
js canvas實(shí)現(xiàn)QQ撥打電話特效
這篇文章主要為大家詳細(xì)介紹了js canvas實(shí)現(xiàn)QQ撥打電話特效，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-05-05
淺析$(function) ready和onload 的區(qū)別
新手剛學(xué)習(xí)js和jq的時(shí)候難免會(huì)接觸題目所標(biāo)識(shí)的相關(guān)內(nèi)容，下面小編通過(guò)本教程給大家講解(function) ready和onload 的區(qū)別，感興趣的朋友一起看看吧
2016-09-09
spirngmvc js傳遞復(fù)雜json參數(shù)到controller的實(shí)例
下面小編就為大家分享一篇spirngmvc js傳遞復(fù)雜json參數(shù)到controller的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2018-03-03
JavaScript中內(nèi)置函數(shù)Map()的使用
Map()是JavaScript中內(nèi)置的一種數(shù)據(jù)結(jié)構(gòu)，它允許您將鍵值對(duì)映射到任意類型的值，主要介紹了JavaScript中內(nèi)置函數(shù)Map()的使用，感興趣的可以了解一下
2023-05-05
javascript中的循環(huán)語(yǔ)句for語(yǔ)句深入理解
for循環(huán)是多數(shù)語(yǔ)言都有的。在javascript中，for循環(huán)有幾種不同的使用情況，下面為大家一一介紹下
2014-04-04
原生js實(shí)現(xiàn)碰撞檢測(cè)
這篇文章主要為大家詳細(xì)介紹了原生js實(shí)現(xiàn)碰撞檢測(cè)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-03-03
ts封裝axios并處理返回值的實(shí)戰(zhàn)案例
在vue項(xiàng)目中,和后臺(tái)交互獲取數(shù)據(jù)這塊,我們通常使用的是axios庫(kù),下面這篇文章主要給大家介紹了關(guān)于ts封裝axios并處理返回值的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2022-08-08
JS 實(shí)現(xiàn)請(qǐng)求調(diào)度器
這篇文章主要介紹了JS 實(shí)現(xiàn)請(qǐng)求調(diào)度器的方法，幫助大家更好的理解和學(xué)習(xí)使用js，感興趣的朋友可以了解下
2021-03-03