在 Twig 模板中包含 SVG

Question

在适当的情况下，我正在将我的资产从 PNG 更改为 SVG，但是我很难将这些 SVG 包含在我的 Twig 模板中。

我正在尝试包含这样的 SVG：

{{ source('/assets/img/crmpicco-horizontal-logo.svg') }}

但是，这会导致以下错误：

无法找到模板“/assets/img/crmpicco-horizo​​ntal-logo.svg”（查看：/Library/WebServer/Documents/crmpicco/symfony/app/Resources/views、/Library/WebServer/Documents/crmpicco/symfony/供应商/symfony/symfony/src/Symfony/Bridge/Twig/Resources/views/Form）。

为什么我不能将此 SVG 包含在与其他资产相同的目录中？具体来说，我有兴趣找出为什么不能将 SVG 视为 Assetic 的资产。

Answer 1

这是我使用的解决方案（带有 Symfony 4 和 Webpack Encore 的 Twig）：

1. 在你的树枝配置中，声明你的公共路径：

twig:
    paths:
        "%kernel.project_dir%/public": public_path

2. 像这样加载你的 svg 资产：

{{ source('@public_path'~asset('build/images/your_file.svg')) }}

Answer 2

您必须使用 twig 扩展名重命名 svg 文件crmpicco-horizontal-logo.svg.twig，然后执行以下操作：

{% include ":svg:crmpicco-horizontal-logo.svg.twig" %}

在本示例中，该文件夹svg位于 app/Ressources/views 中