Symfony2和Assetic - 我的CSS中引用的图像将无法加载

时间:2012-12-09 03:30:26

标签: css symfony css-sprites assetic

我有一个我正在尝试使用的CSS精灵表,但我的CSS文件无法“看到”图像。我按照here提供的答案无效。我的捆绑结构是:

src/
    vendor/
        project/
            bundle/
                Resources/
                    public/
                        css/
                            normalize.css
                            static.css
                        images/
                            sprites.jpg

我已经完成了:

$ app/console assets:install
Installing assets using the hard copy option
Installing assets for Symfony\Bundle\FrameworkBundle into web/bundles/framework
Installing assets for MajorProductions\SewingDiva\SiteBundle into web/bundles/majorproductionssewingdivasite
Installing assets for Sensio\Bundle\DistributionBundle into web/bundles/sensiodistribution

$ app/console assetic:dump
Dumping all dev assets.
Debug mode is on.

22:19:13 [file+] /home/kevin/www/diva/app/../web/css/06758be.css
22:19:13 [file+] /home/kevin/www/diva/app/../web/css/06758be_part_1_normalize_1.css
22:19:13 [file+] /home/kevin/www/diva/app/../web/css/06758be_part_1_static_2.css

不知道还能做什么......

3 个答案:

答案 0 :(得分:6)

通过更改参考来解决它:

{% block styles %}
    {% stylesheets '@MajorProductionsSewingDivaSiteBundle/Resources/public/css/*' filter='cssrewrite' %}
        <link rel="stylesheet" type="text/css" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}

为:

{% block styles %}
    {% stylesheets 'bundles/majorproductionssewingdivasite/css/*' filter='cssrewrite' %}
        <link rel="stylesheet" type="text/css" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}

显然,第一版中的自动魔法参考不是可行的方法,尽管它在官方的Symfony文档中使用。

答案 1 :(得分:1)

@ KevinM1

  

显然,第一版中的自动魔法参考不是要走的路,尽管它&gt;正式使用Symfony官方文档。

它是here(法语,但其他语言的等效文档肯定存在)

答案 2 :(得分:-1)

好吧,来自the documentation

  

这是关键点:一旦让Assetic处理您的资产,文件就会从不同的位置提供。这可能会导致CSS文件出现问题,这些文件通过相对路径引用图像。但是,这可以通过使用cssrewrite过滤器来修复,该过滤器更新CSS文件中的路径以反映其新位置。

因此您需要启用cssrewrite过滤器:

# app/config/config.yml
assetic:
    filters:
        cssrewrite: ~

并在stylesheets块中使用它:

{% stylesheets '@AcmeProjectBundle/Resources/css' filter='cssrewrite' %}
    <link href="{{ asset_url }}">
{% endstylesheets %}