2012-03-31 10 views
7

私はsymfony2をjQuery UIと連携させようとしています。 JavaScriptの部分はうまく動作していますが、画像を正常に動作させるには問題があります。Symfony2のcssrewriteフィルタの画像パスが途切れています

Asseticドキュメントで読んだことの1つは、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のパスは、少なくともファイルシステムの正しいパスを指していますが、私のWebルートとの相対パスでは、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 %} 
+0

私の質問への回答を参照してください、それは実際の例があります:http://stackoverflow.com/questions/9500573/path-of-assets-in-css-files-in-symfony2 – apfelbox

答えて

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>は明らかに作業しているバンドルの名前です。

編集:アセットをwebディレクトリにシンボリックリンクするには、php app/console assets:install --symlink webコマンドを入力してください。

関連する問題