Para acceder a la web desde el lado del PC, podemos pulsar F12 para abrir la herramienta de depuración a través del navegador y ver registros de salida, solicitudes de red, elementos de la página web, cookies y otra información.
Sin embargo, cuando desarrollamos programas y aplicaciones móviles o mini, existe un problema anormal y no podemos ver directamente la información anormal. Este artículo recomienda dos paneles de depuración para desarrolladores front-end.
Primero sube el código fuente:
vConsola
Un panel de depuración ligero, escalable y de front-end para páginas web móviles.
- Revisa los registros de la consola
- Ver solicitudes de red
- Mira la estructura de los elementos de página
- Consulta Cookies, localStorage y SessionStorage
- Ejecutar manualmente la línea de comandos JS
- Plugins personalizados
Dirección:El inicio de sesión del hipervínculo es visible.
eruda
Eruda es un panel de depuración diseñado para la interfaz de páginas web móviles, similar a una versión mini de DevTools, con funciones clave como: capturar registros de consola, comprobar el estado de los elementos, capturar solicitudes XHR, mostrar almacenamiento local e información de cookies, y más.
Arrastrar y soltar botones, ajuste del tamaño de transparencia del panel.
- Panel de consola: captura los registros de consola, soportando log, error, info, warn, dir, time/timeEnd, clear, count, assert, table; soporte para marcadores de posición, incluyendo salida de estilo personalizado %c; Soporte para filtrar por tipo de logarítmica y expresión regular; Se soporta la ejecución de scripts en JavaScript.
- Panel de elementos: Ver contenido y propiedades de etiquetas; Mira cómo se estila tu app en el DOM; Soporte para resaltar elementos de página; Soporta la selección de clic directo en pantalla; Consulta los tipos de eventos vinculados en el DOM.
- Panel de red: Captura solicitudes y visualiza información como datos enviados, cabeceras de retorno y contenido devuelto.
- Panel de recursos: Ver y borrar localStorage, sessionStorage y cookies. Ver scripts de carga de página y archivos de estilo; Ver imágenes de carga de página.
- Panel de fuentes: Ver el código fuente de la página; Formatea datos HTML, CSS, JS y JSON.
- Panel de información: URL de salida y Agente de usuario; Soporta contenido de salida personalizado.
- Panel de fragmentos: añadir bordes a los elementos de la página; Añadir una marca de tiempo para actualizar la página; Se admiten fragmentos de código personalizados.
Dirección:El inicio de sesión del hipervínculo es visible. |
Publicado en 29/6/2020 15:36:20
|
|
|
|
Propietario|
Publicado en 8/2/2025 13:44:17
|
