Laravel 为 Bootstrap 字体混合不正确的 URL

Posted 2023-03-07

【中文标题】Laravel 为 Bootstrap 字体混合不正确的 URL

【英文标题】：Laravel Mix Incorrect Url for Bootstrap Fonts

【发布时间】：2018-07-27 12:00:38

【问题描述】：

我正在使用 laravel 5.5，我正在尝试编译一个带有一些引导程序覆盖的 less 文件。

我的 webpack.mix.js 文件中有以下内容：

 mix.js('resources/assets/js/app.js', 'public/js')
    .less('resources/assets/less/app.less', 'public/css').options(
         processCssUrls: false
    );

app.less 如下：

@import "~bootstrap/less/bootstrap";
@import "_variables.less";

// custom styles

_variables.less 如下：

// Brands
@brand-primary:      #005689;

// Iconography
@icon-font-path:        "../fonts/";

但是编译后的 app.css 生成的字体 url 如下：

@font-face 
   font-family: 'Glyphicons Halflings';
   src: url('../../../node_modules/bootstrap/fonts/glyphicons-halflings-regular.eot');

看起来它生成了相对于导入@import "~bootstrap/less/bootstrap"的url

如何强制它生成字体网址为：

@font-face 
   font-family: 'Glyphicons Halflings';
   src: url('../fonts/glyphicons-halflings-regular.eot');

【参考方案1】：

通过执行以下操作修复：

mix.js('resources/assets/js/app.js', 'public/js')
   .less('resources/assets/less/app.less', 'public/css',  relativeUrls: false
    )
  .options(
     processCssUrls: false
   );

【讨论】：

谢谢，这个修复对我帮助很大。

工作完美，谢谢！