{"id":142,"date":"2023-02-14T00:00:00","date_gmt":"2023-02-13T23:00:00","guid":{"rendered":"https:\/\/helloblog.io\/es\/depurar-wordpress-acorn-wp-debug\/"},"modified":"2026-01-20T06:32:44","modified_gmt":"2026-01-20T05:32:44","slug":"depurar-wordpress-acorn-wp-debug","status":"publish","type":"post","link":"https:\/\/helloblog.io\/es\/depurar-wordpress-acorn-wp-debug\/","title":{"rendered":"Depurar WordPress sin sufrir: c\u00f3mo mejora Acorn la salida de WP_DEBUG"},"content":{"rendered":"\n<p>En desarrollo, <code>WP_DEBUG<\/code> es de esas constantes que deber\u00edan estar activadas siempre: te avisa de <em>notices<\/em>, <em>warnings<\/em> y errores que, si los dejas pasar, terminan convirti\u00e9ndose en bugs dif\u00edciles de rastrear en staging o producci\u00f3n. El problema es que la experiencia \u201cde serie\u201d en WordPress es bastante espartana: te imprime mensajes en pantalla y poco m\u00e1s.<\/p>\n\n\n\n<p>Si trabajas con stacks modernos alrededor de WordPress (por ejemplo Bedrock, el boilerplate de Roots gestionado con Composer), la parte buena es que el modo debug ya suele venir activado en entornos de desarrollo. La parte mejor es que, si adem\u00e1s usas <strong>Acorn<\/strong>, el salto de calidad en el manejo de excepciones es enorme: pasas de texto suelto a p\u00e1ginas de error estructuradas, con <em>stack traces<\/em> navegables y contexto \u00fatil.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Qu\u00e9 hace realmente WP_DEBUG (y por qu\u00e9 su salida se queda corta)<\/h2>\n\n\n\n<p><code>WP_DEBUG<\/code> es el interruptor principal del modo debug en WordPress. Cuando est\u00e1 activo, WordPress muestra (y\/o registra) avisos y errores de PHP que, de otro modo, podr\u00edan quedar ocultos. En un proyecto con plugins, mu-plugins y temas de terceros, esto es oro: el ecosistema est\u00e1 lleno de extensiones que emiten <em>notices<\/em> constantemente.<\/p>\n\n\n\n<p>El punto d\u00e9bil es la <strong>presentaci\u00f3n<\/strong>: el output por defecto tiende a aparecer incrustado en la p\u00e1gina, sin estructura, con poca jerarqu\u00eda visual y sin herramientas para inspeccionar r\u00e1pidamente d\u00f3nde se origin\u00f3 el problema.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"2252\" src=\"https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-default-scaled.png\" alt=\"Salida por defecto de WP_DEBUG mostrando avisos y errores en pantalla\" class=\"wp-image-138\" srcset=\"https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-default-scaled.png 2560w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-default-300x264.png 300w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-default-1024x901.png 1024w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-default-768x676.png 768w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-default-1536x1351.png 1536w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-default-2048x1802.png 2048w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-default-400x352.png 400w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><figcaption class=\"wp-element-caption\">El output nativo de WP_DEBUG funciona, pero no ayuda demasiado cuando el error es complejo. \u2014 <em>Forr\u00e1s: Roots.io<\/em><\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Acorn y el \u201cdebug moderno\u201d en WordPress<\/h2>\n\n\n\n<p>Acorn es el framework de Roots que lleva piezas del ecosistema Laravel a WordPress (contenedor, configuraci\u00f3n, helpers, y en versiones recientes tambi\u00e9n routing). En la pr\u00e1ctica, adem\u00e1s de mejorar tu arquitectura PHP, tambi\u00e9n mejora la experiencia de depuraci\u00f3n cuando tienes <code>WP_DEBUG<\/code> activo.<\/p>\n\n\n\n<div class=\"wp-block-group callout callout-info is-style-info is-layout-flow wp-block-group-is-layout-flow\" style=\"border-width:1px;border-radius:8px;padding-top:1rem;padding-right:1.5rem;padding-bottom:1rem;padding-left:1.5rem\">\n\n<h4 class=\"wp-block-heading callout-title\">Cu\u00e1ndo ver\u00e1s la mejora<\/h4>\n\n\n<p>Seg\u00fan la documentaci\u00f3n de Roots, Acorn mejora la salida de errores cuando est\u00e1n activos <code>WP_DEBUG<\/code> y <code>WP_DEBUG_DISPLAY<\/code>.<\/p>\n\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Salida por defecto con Acorn: manejador de excepciones de Symfony<\/h3>\n\n\n\n<p>De base, Acorn utiliza el <em>exception handler<\/em> de Symfony para renderizar errores. La diferencia es inmediata: obtienes una p\u00e1gina de excepci\u00f3n m\u00e1s legible, con un formato consistente y un stack trace m\u00e1s f\u00e1cil de seguir que el texto plano incrustado en el HTML.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"2252\" src=\"https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-symfony-scaled.png\" alt=\"Salida de WP_DEBUG mejorada por Acorn usando el manejador de excepciones de Symfony\" class=\"wp-image-139\" srcset=\"https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-symfony-scaled.png 2560w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-symfony-300x264.png 300w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-symfony-1024x901.png 1024w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-symfony-768x676.png 768w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-symfony-1536x1351.png 1536w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-symfony-2048x1802.png 2048w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-symfony-400x352.png 400w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><figcaption class=\"wp-element-caption\">Con Acorn, los errores se presentan de forma mucho m\u00e1s clara que con WP_DEBUG \u201ca pelo\u201d. \u2014 <em>Forr\u00e1s: Roots.io<\/em><\/figcaption><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Ignition en WordPress con Acorn v3: experiencia tipo Laravel<\/h3>\n\n\n\n<p>Si vienes de Laravel, probablemente te suene <strong>Ignition<\/strong>: es la p\u00e1gina de error por defecto en Laravel desde la v9 y destaca por lo bien que gu\u00eda durante la depuraci\u00f3n. Con <strong>Acorn v3<\/strong> llega un detalle clave: al incorporar soporte de routing al estilo Laravel, tambi\u00e9n se habilita el uso de Ignition en sitios WordPress que usan Acorn.<\/p>\n\n\n\n<p>Roots recomienda instalar Ignition para tener \u201cla mejor experiencia\u201d de manejo de errores en WordPress cuando est\u00e1s en un stack con Acorn.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"2252\" src=\"https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-ignition-scaled.png\" alt=\"Salida de WP_DEBUG con Acorn e Ignition, mostrando una p\u00e1gina de error avanzada\" class=\"wp-image-140\" srcset=\"https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-ignition-scaled.png 2560w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-ignition-300x264.png 300w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-ignition-1024x901.png 1024w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-ignition-768x676.png 768w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-ignition-1536x1351.png 1536w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-ignition-2048x1802.png 2048w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-ignition-400x352.png 400w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><figcaption class=\"wp-element-caption\">Ignition aporta una experiencia de depuraci\u00f3n similar a Laravel dentro de WordPress. \u2014 <em>Forr\u00e1s: Roots.io<\/em><\/figcaption><\/figure>\n\n\n\n<p>Para empezar a usar Ignition en un proyecto WordPress con Acorn, la instalaci\u00f3n se hace v\u00eda Composer (en modo desarrollo) desde el mismo directorio donde tengas Acorn:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>composer require spatie\/laravel-ignition --dev\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#B392F0\">composer<\/span><span style=\"color:#9ECBFF\"> require<\/span><span style=\"color:#9ECBFF\"> spatie\/laravel-ignition<\/span><span style=\"color:#79B8FF\"> --dev<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<div class=\"wp-block-group callout callout-warning is-style-warning is-layout-flow wp-block-group-is-layout-flow\" style=\"border-width:1px;border-radius:8px;padding-top:1rem;padding-right:1.5rem;padding-bottom:1rem;padding-left:1.5rem\">\n\n<h4 class=\"wp-block-heading callout-title\">Ojo con el contexto de instalaci\u00f3n<\/h4>\n\n\n<p>Ejecuta el comando en el directorio del proyecto donde est\u00e1 instalado Acorn para que la dependencia quede correctamente registrada en el autoload de Composer.<\/p>\n\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Whoops: la opci\u00f3n cl\u00e1sica (sobre todo si sigues en Acorn v2)<\/h3>\n\n\n\n<p>Antes de Acorn v3, una recomendaci\u00f3n habitual era instalar <strong>whoops<\/strong> (la librer\u00eda de filp) para tener p\u00e1ginas de error m\u00e1s amigables. Si est\u00e1s en <strong>Acorn v2<\/strong>, sigue siendo una mejora posible frente a la p\u00e1gina de Symfony, aunque la recomendaci\u00f3n general es actualizar a Acorn v3 cuando te encaje.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"2252\" src=\"https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-whoops-scaled.png\" alt=\"Salida de WP_DEBUG con Acorn usando whoops, con formato mejorado para errores\" class=\"wp-image-141\" srcset=\"https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-whoops-scaled.png 2560w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-whoops-300x264.png 300w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-whoops-1024x901.png 1024w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-whoops-768x676.png 768w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-whoops-1536x1351.png 1536w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-whoops-2048x1802.png 2048w, https:\/\/helloblog.io\/app\/uploads\/sites\/5\/2026\/01\/wp_debug-acorn-whoops-400x352.png 400w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><figcaption class=\"wp-element-caption\">Whoops fue durante a\u00f1os la forma r\u00e1pida de mejorar el debug en proyectos PHP. \u2014 <em>Forr\u00e1s: Roots.io<\/em><\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Si no usas Acorn: plugins que mejoran la depuraci\u00f3n en WordPress<\/h2>\n\n\n\n<p>Aunque Acorn es una soluci\u00f3n muy potente cuando construyes WordPress con una base m\u00e1s moderna (y adem\u00e1s te abre la puerta a cosas como los <em>Laravel helpers<\/em>, es decir, funciones utilitarias muy pr\u00e1cticas del framework), no siempre encaja en todos los proyectos. Si est\u00e1s en un WordPress m\u00e1s tradicional, hay alternativas en forma de plugins que ayudan mucho en local.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n\n<li><strong>Query Monitor<\/strong>: pr\u00e1cticamente imprescindible en un entorno local; aporta visibilidad sobre consultas, hooks, HTTP, errores y mucho m\u00e1s. https:\/\/querymonitor.com\/<\/li>\n\n\n<li><strong>Debug Bar<\/strong>: a\u00f1ade una barra de depuraci\u00f3n con informaci\u00f3n \u00fatil durante el desarrollo. https:\/\/wordpress.org\/plugins\/debug-bar\/<\/li>\n\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Resumen pr\u00e1ctico<\/h2>\n\n\n\n<ol class=\"wp-block-list\">\n\n<li>Activa <code>WP_DEBUG<\/code> siempre en desarrollo para detectar avisos y errores cuanto antes.<\/li>\n\n\n<li>La salida por defecto de WordPress cumple, pero es poco legible cuando el problema escala.<\/li>\n\n\n<li>Con Acorn, el manejo de excepciones mejora autom\u00e1ticamente (Symfony handler) cuando <code>WP_DEBUG<\/code> y <code>WP_DEBUG_DISPLAY<\/code> est\u00e1n habilitados.<\/li>\n\n\n<li>En Acorn v3, puedes usar Ignition (v\u00eda Composer) para una experiencia de depuraci\u00f3n tipo Laravel.<\/li>\n\n\n<li>Si no usas Acorn, Query Monitor y Debug Bar son dos herramientas muy s\u00f3lidas para mejorar el debugging en local.<\/li>\n\n<\/ol>\n\n\n<div class=\"references-section\">\n                <h2>Referencias \/ Fuentes<\/h2>\n                <ul class=\"references-list\"><li><a href=\"https:\/\/roots.io\/better-wordpress-debugging-with-acorn\/\" target=\"_blank\" rel=\"noopener noreferrer\">Better WordPress Debugging with Acorn<\/a><\/li><li><a href=\"https:\/\/roots.io\/bedrock\/\" target=\"_blank\" rel=\"noopener noreferrer\">Bedrock<\/a><\/li><li><a href=\"https:\/\/roots.io\/acorn\/docs\/error-handling\/#ignition\" target=\"_blank\" rel=\"noopener noreferrer\">Error Handling &#8211; Acorn Documentation<\/a><\/li><li><a href=\"https:\/\/roots.io\/acorn\/docs\/upgrading-acorn\/\" target=\"_blank\" rel=\"noopener noreferrer\">Upgrading to Acorn v3 &#8211; Acorn Documentation<\/a><\/li><li><a href=\"https:\/\/github.com\/filp\/whoops\" target=\"_blank\" rel=\"noopener noreferrer\">whoops<\/a><\/li><li><a href=\"https:\/\/querymonitor.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Query Monitor<\/a><\/li><li><a href=\"https:\/\/wordpress.org\/plugins\/debug-bar\/\" target=\"_blank\" rel=\"noopener noreferrer\">Debug Bar<\/a><\/li><\/ul>\n            <\/div>","protected":false},"excerpt":{"rendered":"<p>WP_DEBUG es imprescindible, pero su salida por defecto suele ser poco amable. Con Acorn puedes transformar esos errores en p\u00e1ginas de excepci\u00f3n legibles (y, si vienes de Laravel, incluso con Ignition).<\/p>\n","protected":false},"author":16,"featured_media":137,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[36],"tags":[4,66,8,71,10],"class_list":["post-142","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ecosistema-wordpress","tag-acorn","tag-bedrock","tag-composer","tag-debugging","tag-wordpress"],"_links":{"self":[{"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/posts\/142","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/comments?post=142"}],"version-history":[{"count":1,"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/posts\/142\/revisions"}],"predecessor-version":[{"id":156,"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/posts\/142\/revisions\/156"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/media\/137"}],"wp:attachment":[{"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/media?parent=142"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/categories?post=142"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/helloblog.io\/es\/wp-json\/wp\/v2\/tags?post=142"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}