README

扩展用于在 Terrific 前端方法中采用 Twig。

为 Twig 添加了一个自定义 component 标签，模仿 Nitro 的 handlebars 辅助器。

安装

$ composer require namics/terrific-twig

需求

以下版本的 PHP 当前受支持。

设置

步骤 1: 实现 TemplateInformationProvider

class TemplateInformationProvider implements TemplateInformationProviderInterface
{
    public function getPaths() {
    /* List of path where Terrific Components can be found, e.g.
      @code
      [
        '/var/www/example.com/frontend/src/atoms',
        '/var/www/example.com/frontend/src/molecules',
        '/var/www/example.com/frontend/src/organisms'
      ]
      @endcode */
      return [];
    }
}

步骤 2: 实现 ContextProviderInterface

class ContextProvider implements ContextProviderInterface
{
    public function compile(\Twig\Compiler $compiler, \Twig\Node\Node $component, \Twig\Node\Node $dataVariant, $only) {
        // ...
    }
}

步骤 3: 添加 TerrificLoader

$loader = ...;
$chain = new \Twig\Loader\ChainLoader([$loader, new TerrificLoader(new TemplateInformationProvider)]);
$twig = new \Twig\Environment($chain);

步骤 4: 添加 TerrificExtension

$twig = new \Twig\Environment($chain);
$twig->addExtension(new TerrificExtension(new ContextProvider));

步骤 5: 完成！

用法

{# Includes the component, data object is merged with the context #}
{% component 'Example' { title: 'Inject an Object' } %}

{# Includes the component, data object is injected as a child context #}
{% component 'Example' { title: 'Inject an Object' } only %}

{# Includes the component, object variable data is merged with the context #}
{% set fooComponentData = { title: 'Inject an Object' } %}
{% component 'Example' fooComponentData %}

{# Includes the component with name contained by string variable, data object is merged with the context #}
{% set fooComponentName = 'Example' %}
{% component fooComponentName { title: 'Inject an Object' } %}

{# Includes the component with name contained by string variable, object variable data is merged with the context #}
{% set fooComponentName = 'Example' %}
{% set fooComponentData = { title: 'Inject an Object' } %}
{% component fooComponentName fooComponentData %}

文档

扩展

该扩展为 Twig 提供了出色的扩展。目前，该扩展提供了 ComponentTokenParser。

标记解析器

标记解析器包含了组件标签的解析步骤。它将流转换为不同的节点（component、data）和一个属性（only）。

功能基于出色的 Twig_TokenParser_Include。

节点

节点将标记化的标签编译为 PHP。要查看输出的一部分，请检查 ComponentTest。

加载器

TerrificLoader 加载给定路径内的模板。一个 TemplateLocatorInterface 的实现提供了加载器应搜索模板的路径。递归加载给定目录内的任何目录。

模板信息提供者

TemplateInformationProviderInterface 的实现应返回一个列表，其中包含模板的路径。这些路径应采用以下形式：`['frontend/components/atoms', 'frontend/components/molecules', 'frontend/components/organisms']`。组件目录将由 TerrificLoader 提供（`Example/example.[ext]`）。

上下文提供者

这部分有些棘手。一个 ContextProviderInterface 的实现将决定哪些数据将被提供给 Twig 模板。TODO: 更多内容。

配置读取器

读取 nitro 的 config.json 并解析关键信息，如组件路径和文件扩展名。

测试

可以使用以下命令运行测试

composer run-scrip tests

CI

此项目使用 GitHub actions。

本地运行

安装 nektos/act。
打开终端，进入项目目录。
按照描述运行 act -P ubuntu-latest=shivammathur/node:latest，如此处所述。

鸣谢

此项目部分由 Namics 赞助。

namics / twig-nitro-library

维护者

详细信息