font-awesome not working bundleconfig in MVC5

Solution 1:

Try using CssRewriteUrlTransform when bundling:

bundles.Add(new StyleBundle("~/Content/css").Include(
        "~/Content/bootstrap.css",                        
        "~/Content/body.css",
        "~/Content/site.css",
        "~/Content/form.css"
    ).Include("~/Content/font-awesome-4.0.3/css/font-awesome.css", new CssRewriteUrlTransform());

This changes any urls for assets from within the css file to absolute urls so the bundling doesn't mess up the relative path.

Docs for CssRewriteUrlTransform

Solution 2:

My solution was simple: run PM> Install-Package FontAwesome, and reference the correct path:

.Include("~/Content/font-awesome.min.css")

Solution 3:

I had the same error message and fixed after setting mime types for web fonts in IIS .

Solution 4:

With version 5.1.0 I had to reference all.css instead of fontawesome.css i.e.,

bundles.Add(new StyleBundle("~/bundles/fontawesome").Include(
    "~/Content/all.css",
    new CssRewriteUrlTransform()
));

Solution 5:

I also had this same error message. I had to do a combination of the answers listed in this thread:

1. Add this line of code as suggested by @Simon C:

   .Include("~/Content/font-awesome-4.0.3/css/font-awesome.css", new CssRewriteUrlTransform());

This worked to fix the relative urls, however, I had to delete the font-awesome.min.css file from my bower directory every time I published otherwise the bundler would get confused and not include and minify the font-awesome.css file. So...

2. I had to do what @miha suggested in a comment and fix the relative urls in the font-awesome.min.css file with CssRewriteUrlTransform(). So I decided to rewrite the urls in the .min file and just include that instead of the unminified version and it worked:

   .Include("~/Content/font-awesome-4.0.3/css/font-awesome.min.css", new CssRewriteUrlTransform());

If I understand correctly, the bundler won't try to minify the .min file again because it's already minified. The only "drawback" is it does not concatenate the font-awesome.min.css content into the single css file that the bundler creates. It will be included separately.