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

Question

我试图让 Symfony2 与 jQuery UI 一起工作。我已经让它的 JavaScript 部分工作得很好，但我无法让图像工作。

我在 Assetic 文档中读到的一件事是 cssrewrite filter 可以获取 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路径很远。显然是我的 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 %}

Answer 1

有一些known problems使用 CssRewrite 过滤器。据我所知，使用 @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命令，以便象征性地将您的 Assets 链接到 web目录。