如果我直接引用font-awesome.css
in _layouts页面,它将工作
<link href="~/Content/font-awesome-4.0.3/css/font-awesome.css" rel="stylesheet" />
但是我在BundleConfig.cs
中使用。图标不显示。
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/font-awesome-4.0.3/css/font-awesome.css",
"~/Content/bootstrap.css",
"~/Content/body.css",
"~/Content/site.css",
"~/Content/form.css"
));
我还观察到浏览器控制台有错误的字体目录。Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:51130/fonts/fontawesome-webfont.woff?v=4.0.3
会有什么问题呢?
6条答案
按热度按时间w1e3prcc1#
绑定时尝试使用
CssRewriteUrlTransform
:这会将css文件中的所有资源的url更改为绝对url,这样绑定就不会弄乱相对路径。
CssRewriteUrlTransform的文档
xmq68pz92#
我的解决方案很简单:运行PM〉Install-Package FontAwesome,并引用正确的路径:
a11xaf1n3#
我有相同的错误消息,并修复后setting mime types for web fonts in IIS。
pwuypxnk4#
在版本5.1.0中,我必须引用
all.css
而不是fontawesome.css
,即:4szc88ey5#
我为这个问题补充另一个答案,我是否通过混合其中的一些找到了解决方案。
1.添加this answer建议的条目。
1.请关注most voted answer中@feradz的评论:“* 删除. min.css版本--它导致优化程序无法生成具有正确路径的缩小版本 *”
最后一点是关键:js文件的分布式“min”版本不遵循“CssRewriteUrlTransform”规则。因此,手动删除bootstrap.min.css、font-awesone.min.css最终解决了该问题。
6fe3ivhb6#
我也收到了同样的错误消息。我不得不将此线程中列出的答案组合在一起:
1/按照@Simon C:
这是为了修复相对URL,但是,我不得不删除
font-awesome.min.css
文件从我的bower目录每次我发布,否则bundler会感到困惑,不包括和缩小font-awesome.css
文件。所以...2/我不得不按照@miha在评论中的建议,用
CssRewriteUrlTransform()
修改font-awesome.min.css
文件中的相对url,所以我决定重写.min文件中的url,只包含它而不是未缩小的版本,这样做很有效:如果我没理解错的话,bundler不会再尝试缩小.min文件,因为它已经被缩小了。唯一的“缺点”是它没有将
font-awesome.min.css
内容连接到bundler创建的单个css文件中。它将单独包含。