1.0.2 • Published 2 years ago
twig-wrap-handles v1.0.2
twig-wrap-handles
A plugin for the Twig template engine adapter of Fractal that wraps twig includes with a HTML comment that displays their handle.
Requires Fractal v1.1.0 or greater.
What is it for
This plugin wraps components and partials included via Twig include
tag or Fractal render
tag with a HTML comment that includes their handle.
logo.twig:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 456 456" xml:space="preserve"><circle cx="228" cy="228" r="228" fill="#54aedd"/><path fill="#f9f9f9" d="M129.9 119v200.3h200.3z"/><path fill="#f0f1f1" d="M129.9 319.3h200.3l-110-110-90.3 90.2z"/><path fill="#fff" d="M330.2 119v200.3H129.9z"/></svg>
twig component:
{% include '@logo' %}
rendered component:
<!-- @logo -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 456 456" xml:space="preserve"><circle cx="228" cy="228" r="228" fill="#54aedd" /><path fill="#f9f9f9" d="M129.9 119v200.3h200.3z" /><path fill="#f0f1f1" d="M129.9 319.3h200.3l-110-110-90.3 90.2z" /><path fill="#fff" d="M330.2 119v200.3H129.9z" /></svg>
<!-- /@logo -->
How to install
To install this plugin run:
npm install twig-wrap-handles
then open your fractal.js file and add/modify the following lines:
// Require the Twig adapter
const twigAdapter = require('@frctl/twig')();
// Require twig-wrap-handles plugin
const twigWrapHandles = require('twig-wrap-handles');
// configure Fractal to use the Twig template engine and obtain the engine instance
const instance = fractal.components.engine(twigAdapter);
// instance.twig refers to the twig.js instance
instance.twig.extend(twigWrapHandles);