Failed to decode downloaded font, OTS parsing error: Failed to convert WOFF 2.0 font to SFNT...

[sullaroman]

I have a problem when try to import font-awesome to my project.

Failed to decode downloaded font: http://localhost:8080/d396b5051cc2b597286ba6be02bd1327.woff2
OTS parsing error: Failed to convert WOFF 2.0 font to SFNT
Failed to decode downloaded font: http://localhost:8080/1a5f7cb348ebfe17ee45a78fac811c1d.woff
OTS parsing error: incorrect file size in WOFF header
Failed to decode downloaded font: http://localhost:8080/06d05732fc1f7dbb1bf6f9d4b2b895f4.ttf
OTS parsing error: incorrect entrySelector for table directory

config is

      { test: /\.woff(\?.*$|$)/, loader : 'file-loader' },
      { test: /\.woff2(\?.*$|$)/, loader : 'file-loader' },
      { test: /\.ttf(\?.*$|$)/, loader : 'file-loader' },
      { test: /\.eot(\?.*$|$)/, loader : 'file-loader' },
      { test: /\.svg(\?.*$|$)/, loader : 'file-loader' },

font-awesome installed and works well if to not to use webpack to load it.

[iamdeadman]

I am getting the same error in browser console, when I am trying to load downloaded fonts in it in a angularjs web application, so what is the possible reason for this and how it can be fixed. can anyone please suggest

[SimenB]

We had to use url-loader for webpack-dev-server, and file-loader for prod-build, if that helps

[sankhadeeproy007]

+1

[cage1618]

I have the same issue
I use file-loader instaed url-loader but don't work for me

Failed to decode downloaded font: http://localhost/debug/static/fonts/icomoon/icomoon_054374.ttf
todos:1 OTS parsing error: incorrect entrySelector for table directory
todos:1 Failed to decode downloaded font: http://localhost/debug/static/fonts/icomoon/icomoon_0b6a5d.woff
todos:1 OTS parsing error: incorrect file size in WOFF header

Anyone has some solution?

[bebraw]

Can you set up a standalone example against webpack 2 rc?

[zwsf]

I have same problem, anyone has solution? tks

[rotela]

I have same problem

[webpack-bot]

This issue had no activity for at least half a year.

It's subject to automatic issue closing if there is no activity in the next 15 days.

[miron4dev]

I have the same problem with both file-loader and url-loader. Does anyone have a solution?

[reyramos]

It seems to be only happening in Development mode, while in the production build is not happening, so I just added the CDN in the index.html wrapped around webpack HtmlWebpackPlugin.
Ex:
<% if (htmlWebpackPlugin.options.metadata.isDevServer) { %>

//path link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> -->
<% }

When I build it in production, this will not be included.

[miron4dev]

I fixed the issue adding next configuration to my webpack config file:

{
    test: /\.(svg|woff|woff2|eot|ttf)$/,
    loader: 'file-loader',
    query: {
        name: 'static/media/[name].[hash:8].[ext]'
    }
},
{
    exclude: [
        /\.svg$/,
        /\.woff$/,
        /\.woff2$/,
        /\.eot$/,
        /\.ttf$/,
    ],
    loader: 'url-loader',
    query: {
        limit: 10000,
        name: 'static/media/[name].[hash:8].[ext]'
    }
}

[alexander-akait]

This is very old issue, please create new issue if you have problem. Thanks!