glyphicons-halflings-regular.woff2 not loading 404 error

Question

I have tried a lot and have seen so many answers but none is helping me out here. I am not sure why the glyphicons-halflings-regular.woff2 not able to load even i have latest bootstrap version.

Bootstrap 3 unable to display glyphicon properly

Directory Structure

Error

@font-face rule in css

   @font-face {
  font-family: 'Glyphicons Halflings';

  src: url('../fonts/glyphicons-halflings-regular.eot');
  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

Answer 1

Assign mime type values:

mimeMap:

• fileExtension=".woff"

• mimeType="application/font-woff"

• fileExtension=".woff2"

• mimeType="application/font-woff"