在 Twig 模板中包含 SVG

Question

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

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

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

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

Unable to find template "/assets/img/crmpicco-horizontal-logo.svg" (looked into: /Library/WebServer/Documents/crmpicco/symfony/app/Resources/views, /Library/WebServer/Documents/crmpicco/symfony/vendor/symfony/symfony/src/Symfony/Bridge/Twig/Resources/views/Form).

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

Answer 1

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

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

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

Answer 2

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

在你的 twig 配置中，声明你的 public 路径：

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

像这样加载您的 svg 资源：

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

在 Twig 模板中包含 SVG

Including SVG in Twig template

php

symfony

svg

twig

symfony-2.8