web-dev-qa-db-ja.com

laravel mix：画像とフォントの相対パスをCSSに保持する方法

laravel webpack/mixが実行され、sassがcssに変換されると、url('../images/background.png');のような相対パスがurl('/images/background.png');のような絶対パスに変更されます。

パスが更新されず、相対パスとして保持されない可能性はありますか？

その理由は、展開が異なるサーバー上の異なるフォルダーにある可能性があるため、相対パスがすべてのフォルダー構造で機能するためです。例： http://www.example.com/およびhttp://www.example.com/subfolder/で機能します。ただし、絶対パスが使用されている場合、サブフォルダーの場合、画像とフォントはcssによって検出されません。

この状況を処理するための他のベストプラクティスはありますか？

csslaravelwebpackmix
6
Imran Ahmed

から ドキュメント ：

デフォルトでは、Laravel Mix and Webpackは_example.png_を見つけ、それを_public/images_フォルダーにコピーしてから、生成されたスタイルシート内でurl()を書き換えます。そのため、コンパイルされたCSSは次のようになります。

この機能は便利かもしれませんが、既存のフォルダー構造が既にお好みの方法で構成されている可能性があります。この場合、次のようにurl()書き換えを無効にすることができます。

_mix.sass('resources/assets/app/app.scss', 'public/css')
   .options({
       processCssUrls: false
   });
_

https://laravel.com/docs/5.5/mix#working-with-stylesheets

12
Alexey Mezenin