Symfony2 cssrewrite过滤器的图像路径很远

时间:2012-03-31 23:57:09

标签: jquery-ui symfony assetic

我正在尝试让Symfony2与jQuery UI一起使用。我已经把它的JavaScript部分工作得很好但是我无法让图像工作。

我在Assetic文档中读到的一件事是cssrewrite过滤器可以获取CSS文件中的图像路径并更新它们,使路径指向正确的位置。这看起来就像我需要的那样,所以我启用了cssrewrite。以下是cssrewrite改变路径的方式:

// original
images/ui-icons_222222_256x240.png

// using cssrewrite
../../../app/Resources/public/css/themes/base/images/ui-icons_222222_256x240.png

第一条道路并不好。 cssrewrite路径至少指向文件系统中的正确路径,但相对于我的webroot,cssrewrite路径是WAY off。显然我的app目录不公开。

如何让cssrewrite过滤器将路径更改为实际可用的路径?

这是我的样式表包含。 (是的,我知道我单独包含所有这些CSS文件的方式很愚蠢,但我现在并不担心。)

    {% stylesheets
        '../app/Resources/public/css/*'
        '../app/Resources/public/css/themes/base/jquery.ui.accordion.css'
        '../app/Resources/public/css/themes/base/jquery.ui.all.css'
        '../app/Resources/public/css/themes/base/jquery.ui.autocomplete.css'
        '../app/Resources/public/css/themes/base/jquery.ui.base.css'
        '../app/Resources/public/css/themes/base/jquery.ui.button.css'
        '../app/Resources/public/css/themes/base/jquery.ui.core.css'
        '../app/Resources/public/css/themes/base/jquery.ui.datepicker.css'
        '../app/Resources/public/css/themes/base/jquery.ui.dialog.css'
        '../app/Resources/public/css/themes/base/jquery.ui.progressbar.css'
        '../app/Resources/public/css/themes/base/jquery.ui.resizable.css'
        '../app/Resources/public/css/themes/base/jquery.ui.selectable.css'
        '../app/Resources/public/css/themes/base/jquery.ui.slider.css'
        '../app/Resources/public/css/themes/base/jquery.ui.tabs.css'
        '../app/Resources/public/css/themes/base/jquery.ui.theme.css'
    %}
        <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}

1 个答案:

答案 0 :(得分:11)

CssRewrite过滤器中有一些known problems。据我所知,使用@BundleName表示法无法正常工作,解决方法似乎是使用bundles/bundle_name路径链接CSS文件。

因此,您的代码应该是这样的:

{% stylesheets filter='cssrewrite' 
        'bundles/<your_bundle_name>/css/*'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.accordion.css'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.all.css'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.autocomplete.css'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.base.css'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.button.css'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.resizable.css'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.selectable.css'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.slider.css'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.tabs.css'
        'bundles/<your_bundle_name>/css/themes/base/jquery.ui.theme.css'
    %}
        <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}

<your_bundle_name>显然是您正在处理的捆绑包的名称。

编辑:请记住提供php app/console assets:install --symlink web命令,以便将您的资源符号链接到web目录。