从bundle加载时,字体路径更改为相对

时间:2017-06-22 17:39:37

标签: asp.net-mvc asp.net-mvc-5 bundling-and-minification asp.net-bundling

我已将插件css文件捆绑为

 StyleBundle adminArea = new StyleBundle("~/files/css/admin/common");
 adminArea.Include("~/assets/global/plugins/font-awesome/css/font-awesome.css");

as font awesome使用其位于其目录中的字体我将位于该插件目录中的字体复制到根级别的fonts文件夹中,并将css文件中的位置更改为

@font-face {
  font-family: 'FontAwesome';
  src: url('/fonts/fontawesome-webfont.eot?v=4.4.0');
  src: url('/fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'), 
      url('/fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'), 
      url('/fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'), 
      url('/fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'),
       url('/fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

当请求此捆绑包时,使用相对路径作为字体面源URL的字体真棒css文件点字体将更改为../ fonts / * .eot?v = 4.4.0

@font-face{
font-family:'FontAwesome';
src:url('../fonts/fontawesome-webfont.eot?v=4.4.0');
src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'),
url('../fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'),
url('../fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'),
url('../fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'),
url('../fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
font-weight:normal;
font-style:normal
}

这使得请求转到为未放置字体的bundle创建的虚拟路径。

我的困惑是为什么捆绑将字体绝对路径更改为相对路径。如何在不创建我为bundle创建的文件夹结构的情况下解决这个问题? MVC第5版 .NET Framework:4.5

注意

  1. 我只更改了css minified的unminified版本中的字体url 版本不以任何方式触及。
  2. 我还启用了捆绑优化。

1 个答案:

答案 0 :(得分:0)

我不知道如何在捆绑和缩小中处理或实施,但以下解决方案对我有效,我希望能为那些面临或将面临问题的人工作。

正如我所说,我只更改了css的未编辑版本的字体路径,并且css的缩小版本未受影响。

虽然您在包中启用了优化,其中包含css的未分类版本,并且您为同一文件设置了缩小版本的css,例如

Sample.css和Sample.min.css

然后创建一个包和缩小将采用css的原始缩小版本,而不是缩小css的未经编辑的版本。

因此,更改两个文件中的字体路径将解决问题。这也适用于图像。