Symfony 2 プロジェクト内の CSS ファイル内のアセットを正しく参照するにはどうすればよいですか?

Symfony 2 の CSS ファイルのアセットのパス

Symfony 2 は、CSS や画像ファイルなどのアセットを管理するメカニズムを提供します。アセティックコンポーネント。ただし、特定のプロジェクト ディレクトリ構造では、CSS で参照されるアセットへの正しいパスを指定することが困難になる場合があります。

問題の概要

次のディレクトリ構造を考慮してください。

...
+-src/
| +-MyCompany/
|   +-MyBundle/
|     +-Resources/
|       +-assets/
|         +-css/
|           +-stylesheets...
+-web/
| +-images/
|   +-images...
...

この場合、CSS ファイルは /app/Resources/assets/css にあり、画像は次の場所にあります。 /ウェブ/画像。目標は、CSS ファイル内からこれらの画像を参照することです。

失敗した解決策

最初の解決策: 絶対パス

CSS ファイル内のパスを絶対 URL に変更することは、アプリケーションが常にルートで実行されるとは限らないため、実行可能な解決策ではありません。

2 番目の解決策:CSSrewrite フィルターを使用したアセティック

生成されたコードがディレクトリへの正しいパスを生成しないため、「cssrewrite」フィルターを使用したアセティックの使用も失敗します。

現在の解決策: 相対パス

CSS ファイルに対する相対的な画像パスの定義は、運用環境では機能しますが、開発環境では失敗します。

実用的な解決策

最も効果的な解決策は、CSS ファイルをパブリックにアクセスできるディレクトリに保存し、展開中に CSS を再構築することです。その仕組みは次のとおりです:

1. CSS ファイルを Resources/public/css に移動します。
2. パブリック ディレクトリから CSS ファイルを参照するように Twig テンプレートを更新します。
3. assets:install --symlink コマンドを使用して、適切な場所にパブリック CSS ファイルへのシンボリック リンクを作成します。
4. 展開中に、元の CSS ファイルをパブリック ディレクトリから削除し、シンボリック リンクだけを残します。

このアプローチでは、CSS ファイルは展開中に再コンパイルされ、次のことが保証されます。これらには、画像への正しいパスが含まれています。画像自体は引き続き web/images ディレクトリにありますが、ユーザーは直接アクセスできません。

以上がSymfony 2 プロジェクト内の CSS ファイル内のアセットを正しく参照するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。