Fix Font Awesome WebFont woff2 not working BundleConfig

In this tutorial, I'll show you how to fix Font Awesome woff2 404 not found 'woff2?v=4.6.3 Failed to load resource', when bundles css files in ASP.NET MVC.

• fontawesome-webfont.woff2?v=4.6.3 Failed to load resource: the server responded with a status of 404 (Not Found)
• fontawesome-webfont.woff?v=4.6.3 Failed to load resource: the server responded with a status of 404 (Not Found)

First, Make sure that your web site has not errors while running without bundling css files. If you got an error 'woff2?v=4.6.3 Failed to load resource' return 404 not found, you should read How to fix woff2?v=4.6.3 Failed to load resource to solve it.

You need to add CssRewriteUrlTransform to the RegisterBundles method as shown below or you can also copy the fonts directory to the same project.

using System.Web;
using System.Web.Optimization;

namespace Invoice
{
    public class BundleConfig
    {
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new StyleBundle("~/login/css")
                .Include("~/assets/css/bootstrap.min.css", new CssRewriteUrlTransform())
                .Include("~/assets/css/font-awesome.min.css", new CssRewriteUrlTransform())
                .Include("~/assets/css/beyond.min.css", new CssRewriteUrlTransform())
                .Include("~/assets/css/animate.min.css", new CssRewriteUrlTransform()));

        }
    }
}

This error occurs because the font directory can not be found when creating the css virtual location.