Symfony 3，包含一个带有一些依赖关系的css库

Question

从个人symfony 3项目，我想使用font-awesome库。在config.yml文件中，我添加了一个这样的资产：

    awesomefont_css:
        inputs:
            - '%kernel.root_dir%/../web/library/font-awesome/css/font-awesome.css'

我从index.php页面调用资产：

{% stylesheets output="stylesheet.css"
'@bootstrap_css'
'@awesomefont_css'
"@style_css"
%}
<link rel="stylesheet" href="{{ asset_url }}"/>
{% endstylesheets %}

我清除了缓存（通过php bin / console cache：clear）但是当我加载我的php页面时，我得到了错误：

我理解库字体 - 真棒需要使用一些其他文件。我的问题是：我怎样才能/必须在symfony 3中正确添加这些文件？

谢谢 ！

Answer 1

我从mywebsite / web / library / font-awesome / fonts / *添加样本符号链接到mywebsite / web / fonts。我不知道是否有更好的解决方案，但我找不到另一个和那个工作

Answer 2

我通过作曲家包括fortawesome/font-awesome。

然后，您必须在config.yml中添加其他条目：

        fontawesome_css:
            inputs:
                - '%kernel.root_dir%/../vendor/fortawesome/font-awesome/css/font-awesome.css'
            filters: [cssrewrite]
        font-awesome-otf:
            inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/FontAwesome.otf'
            output: 'fonts/FontAwesome.otf'
        font-awesome-eot:
            inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/fontawesome-webfont.eot'
            output: 'fonts/fontawesome-webfont.eot'
        font-awesome-svg:
            inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/fontawesome-webfont.svg'
            output: 'fonts/fontawesome-webfont.svg'
        font-awesome-ttf:
            inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/fontawesome-webfont.ttf'
            output: 'fonts/fontawesome-webfont.ttf'
        font-awesome-woff:
            inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/fontawesome-webfont.woff'
            output: 'fonts/fontawesome-webfont.woff'
        font-awesome-woff2:
            inputs: '%kernel.root_dir%/../vendor/fortawesome/font-awesome/fonts/fontawesome-webfont.woff2'
            output: 'fonts/fontawesome-webfont.woff2'

那么只包括fontawesome_css（就像你已经做过的那样）：

    {% block stylesheets %}
        {% stylesheets '@bootstrap_css' '@fontawesome_css' '@custom_css' %}
            <link rel="stylesheet" type="text/css" media="screen" href="{{ asset_url }}"/>
        {% endstylesheets %}
    {% endblock %}

最后，跑

bin/console assetic:dump

你完成了！没有必要提及模板中的字体文件，它们会自动复制。

Answer 3

我应该补充说，webpack/encore包是新的，在我看来更好！它取代了资产。

您还可以使用此工具轻松自定义您的引导主题。