集成Font Awesome,Less,Twitter Bootstrap和MVC4捆绑/缩小

Question

我有Font Awesome,Less,Twitter Bootstrap和MVC4都在调试模式下很好地协同工作.

当我从web.config的编译节点部署和删除调试时,MVC4捆绑和缩小开始了.

当我像这样部署浏览我的网站时,字体真棒图标不再有效.

做一个查看源来获取Bootstrap的内容包给我这个HTML:

<link href="/Content/bootstrap?v=q6mwz5qEMtOzVPXqIVuZ8Z6LtMFDC3_UV0F5pQm5Gfg1" rel="stylesheet"/>

获取URL并粘贴在浏览器中我可以获得缩小的代码:

@import"reset.less";@import"variables.less";@import"mixins.less";@import"scaffolding.less";@import"grid.less";@import"layouts.less";@import"type.less";@import"code.less";@import"forms.less";@import"tables.less";@import"font-awesome.less";@import"dropdowns.less";@import"wells.less";@import"component-animations.less";@import"close.less";@import"buttons.less";@import"button-groups.less";@import"alerts.less";@import"navs.less";@import"navbar.less";@import"breadcrumbs.less";@import"pagination.less";@import"pager.less";@import"modals.less";@import"tooltip.less";@import"popovers.less";@import"thumbnails.less";@import"media.less";@import"labels-badges.less";@import"progress-bars.less";@import"accordion.less";@import"carousel.less";@import"hero-unit.less";@import"utilities.less";@import"variables.less";@import"mixins.less";@import"responsive-utilities.less";@import"responsive-1200px-min.less";@import"responsive-768px-979px.less";@import"responsive-767px-max.less";@import"responsive-navbar.less";

我还有一些其他的CSS捆绑包,如上所述,它们都没有显示任何错误.

当我在Visual Studio 2012项目中查看font-awesome.less文件时,VS认为它有许多错误.记住Font Awesome图标在调试中显示正常,所以我认为没有真正的错误.

第一个是:@fontAwesomePath:'../ font';

我认为路径是正确的(无论如何都在调试中工作),但VS告诉我fontAwesomePath不是已知的@指令.

VS认为存在许多其他错误,但同样,字体很棒在调试模式下工作.

有任何想法吗？

Answer 1

一个简单的解决方法是从您的包中删除font-awesome,并使用常规链接标记将其直接包含在_Layout中.

<link href="~/Content/font-awesome.min.css" rel="stylesheet">