Twig debug : Configuración del archivo settings.local.php

Entre las características novedosas que Drupal8 nos muestra, una de las más útiles e importantes es el modo debug de twig.

Twig es el sistema de templates PHP para esta versión, este cuenta con las características de ser flexible, rápido y seguro.  A su vez twig hace el theming más fácil y divertido de desarrollar partiendo desde la sencillez de su sintaxis. 

Para empezar a hacer un tema personalizado en Drupal8 es necesario configurar algunas opciones previamente, debido a que la configuración por defecto hace tedioso el proceso, lo que ocurrirá por ejemplo es que por cada pequeño cambio(marcado, estilos o comportamientos) que se realice en el tema se necesitará limpiar la caché, solo así el cambio será notado, esto se realizaría una y otra vez. 

 

Habilitar el Twig Debug
Podemos habilitar el twig debug directamente en los parámetros del archivo sites/default/services.yml pero también contamos con otra opción la de personalizar un archivo local y así mantener separado la configuración del archivo sites/default/settings.php entre equipos locales y el servidor de producción. 

Para este último primero copiamos el archivo sites/example.settings.local.php y lo renombramos como sites/default/settings.local.php  (Importante la ubicación de este nuevo archivo), luego de ello debemos descomentar el código de la siguiente sección del archivo sites/default/settings.php.

if (file_exists($app_root . '/' . $site_path . '/settings.local.php')){
  include $app_root . '/' . $site_path . '/settings.local.php';
}

Debemos asegurarnos de que en el archivo settings.local.php la siguiente línea se muestre descomentada:

$settings['container_yamls'][] = DRUPAL_ROOT . '/sites/development.services.yml';

Luego debemos descomentar las siguientes líneas en el mismo archivo settings.local.php

$settings['cache']['bins']['render'] = 'cache.backend.null';
$settings['cache']['bins']['dynamic_page_cache'] = 'cache.backend.null';

Las líneas anteriores permiten trabajar los templates de twig sin problemas de caché.

 

En el archivo sites/development.services.yml agregaremos las siguientes de claves y valores,  debemos conseguir el siguiente resultado:

# Local development services.
# To activate this feature, follow the instructions at the top of the
# 'example.settings.local.php' file, which sits next to this file.
parameters:
  http.response.debug_cacheability_headers: true
  twig.config:
    debug: true
    auto_reaload: true
    cache: false
services:
  cache.backend.null:
    class: Drupal\Core\Cache\NullBackendFactory

 

debug: true
En el marcado de cada plantilla nos mostrará comentarios con información muy valiosa para el theming. Además la función dump() podrá ser usada para que nos muestre información de las variables en el template.

auto_reload: true
Automáticamente recompilará las plantillas de twig cuando haya cambios de código.

cache: false
Bueno es bastante obvio que esto determina si la cache estará o no habilitado.

 

Finalmente limpiar la caché.

 

*En algunos muy pocos casos la caché presenta conflictos debido a que se hayan hecho procesos antes de ejecutar todo lo que se describe en este artículo, para corregir está situación se debe reconstruir la caché y eso se hace ingresando a la siguiente ruta a través del navegador (/core/rebuild.php) esto corregirá cualquier problema que se presente.

 

Vale la pena resaltar que estas configuraciones no son recomendadas usarlas en los ambientes de producción y cada vez que se hagan cambios en el archivo .info.yml o se agreguen nuevas plantillas al tema será necesario limpiar la cache.