Package | gulp5-twig |
Description | A Gulp 5 plugin for compiling Twig templates (gulpjs.com) |
Node Version | >= 20 |
Gulp Version | 5.x |
Compile Twig templates seamlessly with Gulp. This plugin is built on top of Twig, the JavaScript implementation of the Twig templating language.
This plugin can be easily integrated with gulp-data for enhanced templating capabilities.
npm install gulp5-twig --save-dev
{# index.twig #}
{% extends "layout.twig" %}
{% block page %}
<header>
<h1>Gulp and Twig</h1>
</header>
<p>
This page is generated by Twig using the gulp5-twig gulp plugin.
</p>
<ul>
{% for instance in anyArray %}
<li>{{ instance }}</li>
{% endfor %}
</ul>
{% endblock %}
{# layout.twig #}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>{{ title }}</title>
<meta name="description" content="A demo of how to use gulp5-twig" />
<meta name="author" content="Alex Lenk" />
</head>
<body>
<article>
{% block page %}{% endblock %}
</article>
<footer>
<p>
Source file: {{ _file.relative }}<br>
Target file: {{ _target.relative }}
</p>
</footer>
</body>
</html>
// gulpfile.js
'use strict';
import gulp from 'gulp';
import data from 'gulp-data';
import twig from 'gulp5-twig';
export function compile() {
return gulp.src('./index.twig')
.pipe(twig({
data: {
title: 'Gulp and Twig',
benefits: [
'Fast',
'Flexible',
'Secure'
]
}
}))
.pipe(gulp.dest('./'));
}
export function dataExample() {
return gulp.src('./index-json.twig')
.pipe(data(function() {
return require('./example/index-data.json');
}))
.pipe(twig())
.pipe(gulp.dest('./'));
}
export default gulp.series(compile, dataExample);
data: [object| The data that is exposed in the twig files. Or use gulp-data to pipe files directly into gulp5-twig
errorLogToConsole: [true|false] logs errors to console (defaults to false)
onError: [function] handle error yourself
cache: [true|false] enables the Twig cache. (defaults to false)
extend: [function (Twig)] extends Twig with new tags types. The Twig attribute is Twig's internal object. Read more here
extname: [string|true|false] output file extension including the '.' like path.extname(filename). Use true
to keep source extname and a "falsy" value to drop the file extension
useFileContents: [true|false] use file contents instead of file path (defaults to false) Read more here
twigParameters: [object] Parameters for creating a Twig template.
-
base: [string] sets the views base folder. Extends can be loaded relative to this path
-
debug: [true|false] enables debug info logging (defaults to false)
-
trace: [true|false] enables tracing info logging (defaults to false)
-
strict_variables: [true|false] If set to false, Twig will silently ignore invalid variables (variables and or attributes/methods that do not exist) and replace them with a null value. When set to true, Twig throws an exception instead (default to false).
functions: [array] extends Twig with given function objects. (default to undefined)
[
{
name: 'nameOfFunction',
func: function(args) {
return 'the function';
},
},
];
filters: [array] extends Twig with given filter objects. (default to undefined)
[
{
name: 'nameOfFilter',
func: function(args) {
return 'the filter';
},
},
];
(MIT License)
Copyright © 2024 Alex Lenk [email protected] https://alexlenk.ru