在 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/vendor/symfony/symfony/src/Symfony/Bridge/Twig/Resources/views/Form）。

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

Answer 1

这是我使用的解决方案（Twig with Symfony 4 and Webpack Encore）：

1. 在您的 twig 配置中，声明您的公共路径：

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

1. 像这样加载您的 svg 资产：

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

Answer 2

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

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

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