我正在尝试让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 %}
答案 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
目录。