Yeoman を使用して AngularJS プロジェクトをスキャフォールディングしました。「rev」タスクを使用して、画像、スクリプト、スタイルなどが一意に識別されるようにしています。
AngularJS アプリケーション内に、ng-include ディレクティブでインポートされたテンプレートがあります。私の問題は、usemin が翻訳中のファイルに関連する各ファイル内の参照を翻訳していることですが、物事がレンダリングされると、それらは私の index.html に取り込まれ、ブラウザーは別の相対パスで物事を引き込みます。
たとえば、次のようなディレクトリ構造があります。
- index.html
- テンプレート/header.html
- images/logo.png
header.html は index.html に取り込まれることがあり、images/logo.png への参照があります。
header.htmlを入れる<img src="images/logo.png" />と、それ自体は適切にロードされますが、usemin によって翻訳されません。
header.htmlを入れる<img src="../images/logo.png" />と、usemin はそれを見つけて翻訳しますが、header.html が index.html に取り込まれると、画像が見つかりません。
usemin のドキュメントには次のように書かれています。
参照が相対の場合、デフォルトでは、参照先のアイテムは宛先ディレクトリの現在のファイルの場所を基準としたパスで検索されます [強調鉱山]
「デフォルト」言語では、相対パスが現在のファイル以外のものに相対的であることを伝える方法があると思いますが、その動作を変更する方法を教えてくれるドキュメントは見つかりませんでした。