För att komma åt webbplatsen på PC-sidan kan vi trycka på F12 för att öppna felsökningsverktyget via webbläsaren och se utdataloggar, nätverksförfrågningar, webbsideselement, cookies och annan information.
Men när vi utvecklar mobila eller miniprogram och appar uppstår ett onormalt problem, och vi kan inte direkt se den onormala informationen. Den här artikeln rekommenderar två front-end utvecklarfelsökningspaneler.
Ladda först upp källkoden:
vConsole
En lättviktig, skalbar, frontend-utvecklarfelsökningspanel för mobila webbsidor.
- Kolla konsolloggarna
- Visa nätverksförfrågningar
- Titta på sidelementets struktur
- Kolla in Cookies, localStorage och SessionStorage
- Kör manuellt JS-kommandoraden
- Anpassade plugins
Adress:Inloggningen med hyperlänken är synlig.
Eruda
Eruda är en felsökningspanel designad för frontend på mobila webbsidor, liknande en miniversion av DevTools, med nyckelfunktioner som: att fånga konsolloggar, kontrollera elementstatus, fånga XHR-förfrågningar, visa lokal lagring och cookieinformation med mera.
Knappdrag och släpp, inställning för panelens transparensstorlek.
- Konsolpanel: fångar konsolloggar, stödlogg, fel, info, varning, dir, tid/tidEnd, rensa, räkna, aktivera, tabell; Stöd för platshållare, inklusive %c anpassad stil på utdata; Stöd filtrering efter logtyp och reguljärt uttryck; JavaScript-skriptexekvering stöds.
- Elementpanel: Visa tagginnehåll och egenskaper; Se hur din app stylar på DOM; Stöd för att markera sidelement; Stöd direktklick på skärmen; Visa vilka typer av händelser som är bundna på DOM.
- Nätverkspanel: Fånga upp förfrågningar och visa information såsom skickad data, returhuvuden och returnerat innehåll.
- Resurspanel: Visa och rensa localStorage, sessionStorage och cookies. Visa sidladdningsskript och stilfiler; Visa bilder på att ladda sidan.
- Källpanel: Visa sidans källkod; Formatera HTML-, CSS-, JS-kod och JSON-data.
- Infopanel: utdata-URL och användaragent; Stöd anpassat utmatningsinnehåll.
- Utdragspanel: lägg till kanter på sidelement; Lägg till en tidsstämpel för att uppdatera sidan; Anpassade kodutdrag stöds.
Adress:Inloggningen med hyperlänken är synlig. |