blocks|key|2677851|text|我得到了完全相同的错误，在我的例子中，它被证明是因为@font-face声明的错误路径。网页检查员从来没有抱怨过404，因为我们正在使用的开发服务器(live-+server+)被配置为在任何404:s上提供默认的index.html。如果不知道你的设置的任何细节，这可能是罪魁祸首。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2677852|entityMap^0|Q|A|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

I got the exact same error, and in my case it turned out to be because of a wrong path for the <code>@font-face</code> declaration. The web inspector never complained with a 404 since the dev server we're using (live-server) was configured to serve up the default index.html on any 404:s. Without knowing any details about your setup, this could be a likely culprit.

blocks|key|2677858|text|如果在IIS上作为服务器和.net+4/4.5运行，它可能会缺少Web.config中的mime+/文件扩展名定义-如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2677859|​|2677860|<system.webServer>
	<staticContent>
++++++<remove+fileExtension=".eot"+/>
++++++<mimeMap+fileExtension=".eot"+mimeType="application/vnd.ms-fontobject"+/>
++++++<remove+fileExtension=".ttf"+/>
++++++<mimeMap+fileExtension=".ttf"+mimeType="application/octet-stream"+/>
++++++<remove+fileExtension=".svg"+/>
++++++<mimeMap+fileExtension=".svg"+mimeType="image/svg%2Bxml"+/>
++++++<remove+fileExtension=".woff"+/>
++++++<mimeMap+fileExtension=".woff"+mimeType="application/font-woff"+/>
++++</staticContent>
</system.webServer>|code-block|syntax|javascript|2677861|2677862|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|N|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|K|$]]

If running on IIS as the server and .net 4/4.5 it might be missing mime / file extension definitions in Web.config - like this:

<div class="snippet" data-lang="js" data-hide="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;system.webServer&gt;
	&lt;staticContent&gt;
 &lt;remove fileExtension=".eot" /&gt;
 &lt;mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" /&gt;
 &lt;remove fileExtension=".ttf" /&gt;
 &lt;mimeMap fileExtension=".ttf" mimeType="application/octet-stream" /&gt;
 &lt;remove fileExtension=".svg" /&gt;
 &lt;mimeMap fileExtension=".svg" mimeType="image/svg+xml" /&gt;
 &lt;remove fileExtension=".woff" /&gt;
 &lt;mimeMap fileExtension=".woff" mimeType="application/font-woff" /&gt;
 &lt;/staticContent&gt;
&lt;/system.webServer&gt;</code></pre>
</div>
</div>

blocks|key|2889540|text|我的问题是我声明了两种字体，而scss似乎希望您声明字体的名称。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2889541|在您的@font-face{}之后，必须声明$my-font:+"OpenSans3.0+or+whatever";|offset|length|style|CODE|2889542|这是每种字体的字体。|2889543|:-)|2889544|entityMap^0|0|3|C|M|10|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@$D|P|E|Q|F|G]|$D|R|E|S|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|T|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|U|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|M|$]]

My issue was that I was declaring two fonts, and scss seems to expect that you declare the name of the font.

after your 
<code>@font-face{}</code>
you must declare 
<code>$my-font: "OpenSans3.0 or whatever";</code>

and this for each font-face. 

:-)

blocks|key|122232|text|试一试|type|unstyled|depth|inlineStyleRanges|entityRanges|data|122233|@font-face+{
++font-family:+'icomoon';
++src:+asset-url('icomoon.eot');
++src:+asset-url('icomoon.eot?#iefix')+format('embedded-opentype'),
+++++++asset-url('icomoon.ttf')+format('truetype'),
+++++++asset-url('icomoon.woff')+format('woff'),
+++++++asset-url('icomoon.svg#icomoon')+format('svg');
++font-weight:+normal;
++font-style:+normal;
}|code-block|syntax|javascript|122234|并将文件重命名为application.css.scss|offset|length|style|CODE|122235|entityMap^0|0|0|8|K|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

try 

<pre class="lang-css prettyprint-override"><code>@font-face {
 font-family: 'icomoon';
 src: asset-url('icomoon.eot');
 src: asset-url('icomoon.eot?#iefix') format('embedded-opentype'),
 asset-url('icomoon.ttf') format('truetype'),
 asset-url('icomoon.woff') format('woff'),
 asset-url('icomoon.svg#icomoon') format('svg');
 font-weight: normal;
 font-style: normal;
}
</code></pre>



and rename your file to <code>application.css.scss</code>

blocks|key|2677891|text|如果您使用的是Chrome，请尝试添加字体的opentype+(OTF)版本，如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2677892|++++...
+++++url('icomoon.otf')+format('opentype'),
++++...|code-block|syntax|javascript|2677893|干杯!|2677894|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

If your are using Chrome, try adding an opentype (OTF) version of your font as shown below:

<pre><code> ...
 url('icomoon.otf') format('opentype'),
 ...
</code></pre>

Cheers!

blocks|key|2677899|text|我也有同样的问题，这对我很有效，https://github.com/webpack/webpack/issues/1468|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|2677900|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/webpack/webpack/issues/1468^0|G|1A|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

I was having the same issue, this worked for me <a href="https://github.com/webpack/webpack/issues/1468" rel="nofollow">https://github.com/webpack/webpack/issues/1468</a>

blocks|key|122273|text|我也有同样的问题。,++OTS+parsing+error:+Failed+to+convert+WOFF+2.0+font+to+SFNT+(index):1+Failed+to+decode+downloaded+font:+http://dev.xyz/themes/custom/xyz_theme/fonts/xyz_rock/rocksansbold/Rock-SansBold.woff2|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|122274|如果您在尝试提交字体时收到此错误消息，则这是.gitattributes+"warning:+CRLF+will+be+replaced+by+LF“的问题|122275|解决此问题的方法是在.gitattributes中添加出现问题的任何字体|122276|*.ttf+++++-text+diff
*.eot+++++-text+diff
*.woff++++-text+diff
*.woff2+++-text+diff|code-block|syntax|javascript|122277|然后我删除了损坏的字体文件，并重新应用了新的字体文件，效果很好。|122278|entityMap^0|9|5C|0|12|10|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@$9|T|A|U|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|V|8|@$9|W|A|X|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|Y|8|@]|D|@]|E|$]]|$1|J|3|K|5|L|7|Z|8|@]|D|@]|E|$M|N]]|$1|O|3|P|5|6|7|10|8|@]|D|@]|E|$]]|$1|Q|3|-4|5|6|7|11|8|@]|D|@]|E|$]]]|R|$]]

I was having the same issue.<code>, 
OTS parsing error: Failed to convert WOFF 2.0 font to SFNT
(index):1 Failed to decode downloaded font: http://dev.xyz/themes/custom/xyz_theme/fonts/xyz_rock/rocksansbold/Rock-SansBold.woff2</code>

If you got this error message while trying to commit your font then it is an issue with .gitattributes
 "<code>warning: CRLF will be replaced by LF</code>"

The solution for this is adding whichever font you are getting the issue with in .gitattributes

<pre><code>*.ttf -text diff
*.eot -text diff
*.woff -text diff
*.woff2 -text diff
</code></pre>

Then I deleted corrupt font files and reapplied the new font files and is working great.

blocks|key|122280|text|For+it+is+fixed+by+using+below+statement+in+app.web.scss
++++$fa-font-path:+++"../../node_modules/font-awesome/fonts/"+!default;
++++@import+"../../node_modules/font-awesome/scss/font-awesome";|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|122281|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>For it is fixed by using below statement in app.web.scss
 $fa-font-path: "../../node_modules/font-awesome/fonts/" !default;
 @import "../../node_modules/font-awesome/scss/font-awesome";
</code></pre>

blocks|key|124176|text|如果你使用bootstrap，那么更新bootstrap+css(bootstrap.min.css)文件和字体文件。我用这个解决方案解决了我的问题。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|124177|entityMap^0|X|H|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

If you use bootstrap then Update bootstrap css(<code>bootstrap.min.css</code>) file and fonts files. I fixed my problem with this solution.

blocks|key|124186|text|我有一个损坏的字体，尽管它似乎加载没有问题，在Chrome+devtools的源码下似乎显示，字节数是不正确的，所以我再次下载并解决了它。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|124187|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

I had a corrupted font, although it appeared to be loading without problem and under Sources in Chrome devtools appeared to display, the byte count wasn't correct, so I downloaded again and it resolved it.

blocks|key|121453|text|我在IIS中使用ASP.NET，结果发现我只需要将MIME类型添加到IIS中：'.woff2‘/+'application/font-woff’|type|unstyled|depth|inlineStyleRanges|entityRanges|data|121454|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

I am using ASP.NET with IIS and it turns out I just needed to add
the MIME-type to IIS: '.woff2' / 'application/font-woff'

blocks|key|2889765|text|在尝试了许多其他方法，以及大量的重新安装和检查之后，我刚刚修复了这个问题，从Chrome中清除浏览数据(缓存的图像和文件)，然后刷新页面。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2889766|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

After trying lots of other approaches, and lots of re-installs and checks, I have just fixed the issue by clearing out browsing data from Chrome (cached images and files) and then refreshing the page.

blocks|key|2678096|text|在使用angular-cli时，以下是对我有效的方法：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2678097|<?xml+version="1.0"+encoding="utf-8"?>
<configuration>
++++<system.webServer>
++++++++<staticContent>
++++++++++++<remove+fileExtension=".eot"+/>
++++++++++++<mimeMap+fileExtension=".eot"+mimeType="application/vnd.ms-fontobject"+/>
++++++++++++<remove+fileExtension=".ttf"+/>
++++++++++++<mimeMap+fileExtension=".ttf"+mimeType="application/octet-stream"+/>
++++++++++++<remove+fileExtension=".svg"+/>
++++++++++++<mimeMap+fileExtension=".svg"+mimeType="image/svg%2Bxml"+/>
++++++++++++<remove+fileExtension=".woff"+/>
++++++++++++<mimeMap+fileExtension=".woff"+mimeType="application/font-woff"+/>
++++++++++++<remove+fileExtension=".woff2"+/>
++++++++++++<mimeMap+fileExtension=".woff2"+mimeType="application/font-woff2"+/>
++++++++++++<remove+fileExtension=".json"+/>
++++++++++++<mimeMap+fileExtension=".json"+mimeType="application/json"+/>
++++++++</staticContent>
++++++++<rewrite>
++++++++++++<rules>
++++++++++++++++<rule+name="AngularJS"+stopProcessing="true">
++++++++++++++++++++<match+url="%5E(?!.*(.bundle.js%7C.bundle.js.map%7C.bundle.js.gz%7C.bundle.css%7C.bundle.css.gz%7C.chunk.js%7C.chunk.js.map%7C.png%7C.jpg%7C.ico%7C.eot%7C.svg%7C.woff%7C.woff2%7C.ttf%7C.html)).*$"+/>
++++++++++++++++++++<conditions+logicalGrouping="MatchAll">
++++++++++++++++++++</conditions>
++++++++++++++++++++<action+type="Rewrite"+url="/"++appendQueryString="true"+/>
++++++++++++++++</rule>
++++++++++++</rules>
++++++++</rewrite>
++++</system.webServer>
</configuration>|code-block|syntax|javascript|2678098|entityMap^0|3|B|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

When using <code>angular-cli</code>, this is what works for me:

<pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;configuration&gt;
 &lt;system.webServer&gt;
 &lt;staticContent&gt;
 &lt;remove fileExtension=".eot" /&gt;
 &lt;mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" /&gt;
 &lt;remove fileExtension=".ttf" /&gt;
 &lt;mimeMap fileExtension=".ttf" mimeType="application/octet-stream" /&gt;
 &lt;remove fileExtension=".svg" /&gt;
 &lt;mimeMap fileExtension=".svg" mimeType="image/svg+xml" /&gt;
 &lt;remove fileExtension=".woff" /&gt;
 &lt;mimeMap fileExtension=".woff" mimeType="application/font-woff" /&gt;
 &lt;remove fileExtension=".woff2" /&gt;
 &lt;mimeMap fileExtension=".woff2" mimeType="application/font-woff2" /&gt;
 &lt;remove fileExtension=".json" /&gt;
 &lt;mimeMap fileExtension=".json" mimeType="application/json" /&gt;
 &lt;/staticContent&gt;
 &lt;rewrite&gt;
 &lt;rules&gt;
 &lt;rule name="AngularJS" stopProcessing="true"&gt;
 &lt;match url="^(?!.*(.bundle.js|.bundle.js.map|.bundle.js.gz|.bundle.css|.bundle.css.gz|.chunk.js|.chunk.js.map|.png|.jpg|.ico|.eot|.svg|.woff|.woff2|.ttf|.html)).*$" /&gt;
 &lt;conditions logicalGrouping="MatchAll"&gt;
 &lt;/conditions&gt;
 &lt;action type="Rewrite" url="/" appendQueryString="true" /&gt;
 &lt;/rule&gt;
 &lt;/rules&gt;
 &lt;/rewrite&gt;
 &lt;/system.webServer&gt;
&lt;/configuration&gt;
</code></pre>

blocks|key|124207|text|当我使用EditorConfig选项end_of_line+=+lf通过Sublime+Text打开和保存.woff和.woff2文件时，我也遇到了同样的问题。我只是将文件复制到字体文件夹，而没有在Sublime中打开它们，问题就解决了。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|124208|entityMap^0|4|C|I|G|1H|5|1O|5|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]|$9|M|A|N|B|C]|$9|O|A|P|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|G|$]]

I had same problem when I opened and saved <code>.woff</code> and .<code>woff2</code> files through Sublime Text with <code>EditorConfig</code> option <code>end_of_line = lf</code>.
I just copied files to font folder without opening them into Sublime and problem was solved.

blocks|key|124316|text|我得到了以下错误：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|124317|Failed+to+decode+downloaded+font:+[...]/fonts/glyphicons-halflings-regular.woff2
OTS+parsing+error:+invalid+version+tag|code-block|syntax|javascript|124318|直接从以下地址下载原始文件后修复：|124319|https://github.com/twbs/bootstrap/blob/master/fonts/glyphicons-halflings-regular.woff2|offset|length|124320|问题是在下载文件时出现代理错误(它包含HTML错误消息)。|124321|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|0|0|2E|0|0|0^^$0|@$1|2|3|4|5|6|7|V|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|W|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|X|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|Y|8|@]|9|@$K|Z|L|10|1|11]]|A|$]]|$1|M|3|N|5|6|7|12|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|13|8|@]|9|@]|A|$]]]|P|$Q|$5|R|S|T|A|$U|J]]]]

I was getting the following errors:

<pre><code>Failed to decode downloaded font: [...]/fonts/glyphicons-halflings-regular.woff2
OTS parsing error: invalid version tag
</code></pre>

which was fixed after downloading the raw file directly from: 
<a href="https://github.com/twbs/bootstrap/blob/master/fonts/glyphicons-halflings-regular.woff2" rel="nofollow noreferrer">https://github.com/twbs/bootstrap/blob/master/fonts/glyphicons-halflings-regular.woff2</a>

The problem was that there was a proxy error when downloading the file (it contained the HTML error message).

blocks|key|2678142|text|我也有同样的问题，那是因为git把这些文件当成了文本。因此，在生成代理中签出文件时，没有维护二进制文件。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2678143|将此代码添加到您的.gitattributes文件中，然后尝试。|offset|length|style|CODE|2678144|*.eot+binary
*.ttf+binary
*.woff+binary
*.woff2+binary|code-block|syntax|javascript|2678145|entityMap^0|0|9|E|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@$D|Q|E|R|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|S|8|@]|9|@]|A|$K|L]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

I had the same issue and that was because of the git treating these files as text. So while checking out the files in build agents, binary was not maintained.

Add this to your <code>.gitattributes</code> file and try.

<pre><code>*.eot binary
*.ttf binary
*.woff binary
*.woff2 binary
</code></pre>

blocks|key|121484|text|转到GitHub上的以下地址并下载每个FontAwesome文件。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|121485|https://github.com/FortAwesome/font-awesome-sass/tree/master/assets/fonts/font-awesome|offset|length|121486|...but不是右键单击并将链接另存为，而是单击每个文件并使用“下载”按钮保存它们。|121487|我发现将链接保存为下载的超文本标记语言页面而不是FontAwesome文件二进制文件本身。|121488|一旦我拥有了所有的二进制文件，它就可以为我工作了。|121489|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|2E|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@]|9|@$D|U|E|V|1|W]]|A|$]]|$1|F|3|G|5|6|7|X|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|Y|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|Z|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|10|8|@]|9|@]|A|$]]]|M|$N|$5|O|P|Q|A|$R|C]]]]

Go to the address below on GitHub and download each of the FontAwesome files.

<a href="https://github.com/FortAwesome/font-awesome-sass/tree/master/assets/fonts/font-awesome" rel="nofollow noreferrer">https://github.com/FortAwesome/font-awesome-sass/tree/master/assets/fonts/font-awesome</a>

...but instead of right-clicking and saving the link as, click on each of the files and use the 'Download' button to save them. 

I found that saving the link as downloaded an HTML page and not the FontAwesome file binary itself. 

Once I had all of the binaries it worked for me.

blocks|key|124260|text|对于angular-cli和webpack的用户，我怀疑在导入css文件中的字体时存在一些问题，所以请同时提供以下用单引号编码的url位置-|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|124261|@font-face+{
font-family:+'some_family';
src:+url('./assets/fonts/folder/some_family-regular-webfont.woff2')+format('woff2'),
+++++url('./assets/fonts/folder/some_family-regular-webfont.woff')+format('woff');
font-weight:+normal;
font-style:+normal;
}|code-block|syntax|javascript|124262|这篇文章可能已经过时了，但这是一个对我有效的解决方案。|124263|entityMap^0|2|B|E|7|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|T|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|U|8|@]|D|@]|E|$]]|$1|M|3|-4|5|6|7|V|8|@]|D|@]|E|$]]]|N|$]]

For angular-cli and webpack users I suspected that there is some issue while importing the fonts in css file , so please also provide url location encoded with single quotes as following - 

<pre><code>@font-face {
font-family: 'some_family';
src: url('./assets/fonts/folder/some_family-regular-webfont.woff2') format('woff2'),
 url('./assets/fonts/folder/some_family-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
</code></pre>

This post might be old , but this is the solution which worked for me .

blocks|key|2889980|text|我也遇到过同样的问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2889981|将字体版本(例如?v=1.101)添加到字体URLS应该可以做到这一点;)|offset|length|style|CODE|2889982|@font-face+{
++++font-family:+'Open+Sans';
++++font-style:+normal;
++++font-weight:+600;
++++src:+url('../fonts/open-sans-v15-latin-600.eot?v=1.101');+/*+IE9+Compat+Modes+*/
++++src:+local('Open+Sans+SemiBold'),+local('OpenSans-SemiBold'),
++++url('../fonts/open-sans-v15-latin-600.eot?#iefix')+format('embedded-opentype'),+/*+IE6-IE8+*/
++++url('../fonts/open-sans-v15-latin-600.woff2?v=1.101')+format('woff2'),+/*+Super+Modern+Browsers+*/
++++url('../fonts/open-sans-v15-latin-600.woff?v=1.101')+format('woff'),+/*+Modern+Browsers+*/
++++url('../fonts/open-sans-v15-latin-600.ttf')+format('truetype'),+/*+Safari,+Android,+iOS+*/
++++url('../fonts/open-sans-v15-latin-600.svg#OpenSans')+format('svg');+/*+Legacy+iOS+*/
}|code-block|syntax|javascript|2889983|点击(鼠标右键点击)字体的TTF版本，并在上下文菜单中选择“获取信息”(Mac+OSX)“属性”(Windows)应该足以访问字体版本。|2889984|entityMap^0|0|8|8|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@$D|S|E|T|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|U|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

I've had the same issue.

Adding the font version (e.g. <code>?v=1.101</code>) to the font URLS should do the trick ;)

<pre><code>@font-face {
 font-family: 'Open Sans';
 font-style: normal;
 font-weight: 600;
 src: url('../fonts/open-sans-v15-latin-600.eot?v=1.101'); /* IE9 Compat Modes */
 src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
 url('../fonts/open-sans-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
 url('../fonts/open-sans-v15-latin-600.woff2?v=1.101') format('woff2'), /* Super Modern Browsers */
 url('../fonts/open-sans-v15-latin-600.woff?v=1.101') format('woff'), /* Modern Browsers */
 url('../fonts/open-sans-v15-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
 url('../fonts/open-sans-v15-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
</code></pre>

Clicking (right mouse click) on font's TTF version and selecting "Get Info" (Mac OSX) "Properties" (Windows) in context menu should be enough to access the font version.

blocks|key|121613|text|如果其他答案不起作用，请尝试：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|121614|121615|检查.htaccess文件|ordered-list-item|121616|121617|#+Fonts|offset|length|style|CODE|121618|#+Add+correct+content-type+for+fonts|121619|AddType+application/vnd.ms-fontobject+.eot|121620|AddType+application/x-font-ttf+.ttf|121621|AddType+application/x-font-opentype+.otf|121622|AddType+application/x-font-woff+.woff|121623|AddType+application/x-font-woff2+.woff2|121624|AddType+image/svg%2Bxml+.svg|121625|121626|clear+server+cache|121627|clear+browser+cache+&+reload|121628|121629|entityMap^0|0|0|0|0|0|7|0|0|10|0|0|16|0|0|Z|0|0|14|0|0|11|0|0|13|0|0|Q|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|18|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|19|8|@]|9|@]|A|$]]|$1|C|3|D|5|E|7|1A|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|1C|8|@$I|1D|J|1E|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|1F|8|@$I|1G|J|1H|K|L]]|9|@]|A|$]]|$1|O|3|P|5|6|7|1I|8|@$I|1J|J|1K|K|L]]|9|@]|A|$]]|$1|Q|3|R|5|6|7|1L|8|@$I|1M|J|1N|K|L]]|9|@]|A|$]]|$1|S|3|T|5|6|7|1O|8|@$I|1P|J|1Q|K|L]]|9|@]|A|$]]|$1|U|3|V|5|6|7|1R|8|@$I|1S|J|1T|K|L]]|9|@]|A|$]]|$1|W|3|X|5|6|7|1U|8|@$I|1V|J|1W|K|L]]|9|@]|A|$]]|$1|Y|3|Z|5|6|7|1X|8|@$I|1Y|J|1Z|K|L]]|9|@]|A|$]]|$1|10|3|-4|5|6|7|20|8|@]|9|@]|A|$]]|$1|11|3|12|5|E|7|21|8|@]|9|@]|A|$]]|$1|13|3|14|5|E|7|22|8|@]|9|@]|A|$]]|$1|15|3|-4|5|6|7|23|8|@]|9|@]|A|$]]|$1|16|3|-4|5|6|7|24|8|@]|9|@]|A|$]]]|17|$]]

If other answers didn't work try:

<ol>
<li>check .htaccess file 

<code># Fonts</code> 
<code># Add correct content-type for fonts</code> 

<code>AddType application/vnd.ms-fontobject .eot</code> 
<code>AddType application/x-font-ttf .ttf</code> 
<code>AddType application/x-font-opentype .otf</code> 
<code>AddType application/x-font-woff .woff</code> 
<code>AddType application/x-font-woff2 .woff2</code> 
<code>AddType image/svg+xml .svg</code> </li>
<li>clear server cache</li>
<li>clear browser cache &amp; reload</li>
</ol>

blocks|key|121641|text|检查你的字体的css文件。(fontawesome.css/fontawesome.min.css)，您将看到如下所示：|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|121642|@font-face+{
++++font-family:+'FontAwesome';
++++src:+url('../fonts/fontawesome-webfont.eot-v=4.6.3.htm');
++++src:+url('../fonts/fontawesome-webfont.eot#iefix-v=4.6.3')+format('embedded-opentype'),+url('../fonts/fontawesome-webfont.woff2-v=4.6.3.htm')+format('woff2'),+url('../fonts/fontawesome-webfont.woff-v=4.6.3.htm')+format('woff'),+url('../fonts/fontawesome-webfont.ttf-v=4.6.3.htm')+format('truetype'),+url('../fonts/fontawesome-webfont.svg-v=4.6.3.htm#fontawesomeregular')+format('svg');
++++font-weight:+normal;
++++font-style:+normal
}|code-block|syntax|javascript|121643|您将在字体的文件扩展名后面看到版本标签。像这样：|121644|121645|+-v=4.6.3|blockquote|121646|121647|121648|您只需从css文件中删除此标记即可。删除后，您需要转到您的fonts文件夹，您将看到：|121649|📷|atomic|121650|​|121651|而且，从这些字体文件中，您只需从文件名中删除版本标签-v=4.6.3即可。|121652|然后，问题就解决了。|121653|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/c5e7962aaf7c7f6bb84e189c4f6a10c5.png|imageAlt^0|4|1A|0|0|F|9|0|0|1|8|0|0|0|0|17|0|0|1|0|1|0|0|0|1|0|0|11|0|0|A|0^^$0|@$1|2|3|4|5|6|7|1C|8|@$9|1D|A|1E|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|1F|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|1G|8|@$9|1H|A|1I|B|C]]|D|@]|E|$]]|$1|M|3|-4|5|6|7|1J|8|@]|D|@]|E|$]]|$1|N|3|O|5|P|7|1K|8|@$9|1L|A|1M|B|C]]|D|@]|E|$]]|$1|Q|3|-4|5|6|7|1N|8|@]|D|@]|E|$]]|$1|R|3|-4|5|6|7|1O|8|@]|D|@]|E|$]]|$1|S|3|T|5|6|7|1P|8|@$9|1Q|A|1R|B|C]]|D|@]|E|$]]|$1|U|3|V|5|W|7|1S|8|@$9|1T|A|1U|B|C]]|D|@$9|1V|A|1W|1|1X]]|E|$]]|$1|X|3|Y|5|6|7|1Y|8|@$9|1Z|A|20|B|C]]|D|@]|E|$]]|$1|Z|3|10|5|6|7|21|8|@$9|22|A|23|B|C]]|D|@]|E|$]]|$1|11|3|12|5|6|7|24|8|@$9|25|A|26|B|C]]|D|@]|E|$]]|$1|13|3|-4|5|6|7|27|8|@]|D|@]|E|$]]]|14|$15|$5|16|17|18|E|$19|1A|1B|-4]]]]

Check your font's css file. (fontawesome.css/fontawesome.min.css), you will see like this:

<pre><code>@font-face {
 font-family: 'FontAwesome';
 src: url('../fonts/fontawesome-webfont.eot-v=4.6.3.htm');
 src: url('../fonts/fontawesome-webfont.eot#iefix-v=4.6.3') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2-v=4.6.3.htm') format('woff2'), url('../fonts/fontawesome-webfont.woff-v=4.6.3.htm') format('woff'), url('../fonts/fontawesome-webfont.ttf-v=4.6.3.htm') format('truetype'), url('../fonts/fontawesome-webfont.svg-v=4.6.3.htm#fontawesomeregular') format('svg');
 font-weight: normal;
 font-style: normal
}
</code></pre>

you will see version tag after your font's file extension name. Like:

<blockquote>
 -v=4.6.3
</blockquote>

You just need to remove this tag from your css file.
After removing this, you need to go to your fonts folder, And you will see:
<a href="https://i.stack.imgur.com/vQHDd.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vQHDd.png" alt="enter image description here"></a>

And, Form these font's files, you just need to remove the version tag -v=4.6.3 from the file name.

Then, The problem will be sloved.

blocks|key|2890055|text|只需在@font-face中声明如下格式：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2890056|​|2890057|@font-face+{
++font-family:+'Some+Family';
++src:+url('/fonts/fontname.ttf')+format('ttf');+/*+and+this+for+every+font+*/
}|code-block|syntax|javascript|2890058|2890059|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|N|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|K|$]]

Just state format at @font-face as following:

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-css lang-css prettyprint-override"><code>@font-face {
 font-family: 'Some Family';
 src: url('/fonts/fontname.ttf') format('ttf'); /* and this for every font */
}</code></pre>
</div>
</div>

blocks|key|2678331|text|以防万一这和某人有关。在Visual+studio中使用ASP.NET和C#时，我得到了完全相同的错误。当我在visual+studio中启动这个应用程序时，它工作了，但我遇到了这个问题。与此同时，事实证明，我的项目路径包含字符"#“(c:\C#\testapplication)。这似乎混淆了IIS+Express+(可能也是IIS)，并导致了这个问题。我猜"#“是ASP.NET或以下的某个地方的保留字符。改变路径很有帮助，现在它可以按预期工作了。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2678332|向Christof致敬|2678333|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

just in case this is relevant for someone. I got the exact same error using ASP.NET and C# in Visual studio. When I started the app from within the visual studio it worked, but I got this issue. In the meantime, it turned out, that the path to my project contained the character "#" (c:\C#\testapplication). This seems to confuse IIS Express (maybe also IIS) and causes this issue. I guess "#" is a reserved character somewhere in ASP.NET or below. Changing the path helped and now it works as expected.

Regards
Christof

blocks|key|2890085|text|对我有帮助的是，我改变了顺序。首先加载了.eot+get，但我的错误是在加载.eot时出错。因此，我放弃了.eot作为woff2的第一个src，错误也就消失了。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2890086|所以代码现在是：|2890087|@font-face+{
++font-family:+'icomoon';
++src:++url('assets/fonts/icomoon.woff2?9h1pxj')+format('woff2');
++src:++url('assets/fonts/icomoon.eot?9h1pxj#iefix')+format('embedded-opentype'),
++++url('assets/fonts/icomoon.woff2?9h1pxj')+format('woff2'),
++++url('assets/fonts/icomoon.ttf?9h1pxj')+format('truetype'),
++++url('assets/fonts/icomoon.woff?9h1pxj')+format('woff'),
++++url('assets/fonts/icomoon.svg?9h1pxj#icomoon')+format('svg');
++font-weight:+normal;
++font-style:+normal;
++font-display:+block;
}|code-block|syntax|javascript|2890088|是这样的：|2890089|@font-face+{
++font-family:+'icomoon';
++src:++url('assets/fonts/icomoon.eot?9h1pxj');
++src:++url('assets/fonts/icomoon.eot?9h1pxj#iefix')+format('embedded-opentype'),
++++url('assets/fonts/icomoon.woff2?9h1pxj')+format('woff2'),
++++url('assets/fonts/icomoon.ttf?9h1pxj')+format('truetype'),
++++url('assets/fonts/icomoon.woff?9h1pxj')+format('woff'),
++++url('assets/fonts/icomoon.svg?9h1pxj#icomoon')+format('svg');
++font-weight:+normal;
++font-style:+normal;
++font-display:+block;
}|2890090|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

What helped me was that I changed the order. The .eot get's loaded first, but my error was on loading the .eot. So I ditched the .eot as a first src for woff2 and the error went away.

So code is now:

<pre><code>@font-face {
 font-family: 'icomoon';
 src: url('assets/fonts/icomoon.woff2?9h1pxj') format('woff2');
 src: url('assets/fonts/icomoon.eot?9h1pxj#iefix') format('embedded-opentype'),
 url('assets/fonts/icomoon.woff2?9h1pxj') format('woff2'),
 url('assets/fonts/icomoon.ttf?9h1pxj') format('truetype'),
 url('assets/fonts/icomoon.woff?9h1pxj') format('woff'),
 url('assets/fonts/icomoon.svg?9h1pxj#icomoon') format('svg');
 font-weight: normal;
 font-style: normal;
 font-display: block;
}
</code></pre>

And is was:

<pre><code>@font-face {
 font-family: 'icomoon';
 src: url('assets/fonts/icomoon.eot?9h1pxj');
 src: url('assets/fonts/icomoon.eot?9h1pxj#iefix') format('embedded-opentype'),
 url('assets/fonts/icomoon.woff2?9h1pxj') format('woff2'),
 url('assets/fonts/icomoon.ttf?9h1pxj') format('truetype'),
 url('assets/fonts/icomoon.woff?9h1pxj') format('woff'),
 url('assets/fonts/icomoon.svg?9h1pxj#icomoon') format('svg');
 font-weight: normal;
 font-style: normal;
 font-display: block;
}
</code></pre>

blocks|key|124489|text|我已经两次遇到这个问题了，图标字体是由icomoon生成的。在这两种情况下，其中一个图标使用“空格字符”(20)|type|unstyled|depth|inlineStyleRanges|entityRanges|data|124490|似乎是使用空格字符(代码20)触发了这个问题。在我将代码更改为20+(空格)以外的值后，该字体在Chrome中工作正常。|124491|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

I've had this problem twice already with icon fonts generated by icomoon. In both cases one of the icons was using the &quot;space character&quot; (20)
It seems that using the space character (code 20) is triggering this issue. After I changed the code to something other than 20 (space), the font worked properly in Chrome.

blocks|key|2890128|text|在node.js服务器上运行时，我也遇到了同样的问题。问题不是来自我的导航器，而是服务器！|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|2890129|我只是简单地使用fs.readFile(...)函数。这对于很小的文件(我最多使用10ko+)已经足够了，但是我的字体文件大约是150ko，这对于所有这些异步的东西来说太多了:/|CODE|2890130|我使用流解决了这个问题：|2890131|(数据在被流读取时发送)|2890132|const+stream+=+fs.createFileStream(filename);

stream.on("error",+()+=>+{
++++//+error+:+file+does+not+exist,+etc.
++++res.setHeader("content-type",+"text/plain");
++++res.statusCode+=+404;
++++res.end("ouuups,+problem+:/");
}

stream.on("open",+()+=>+{
++++//+good
++++res.setHeader("content-type",+mime);
++++++++//+mime+is+your+font+/+file+mime-type
++++res.statusCode+=+200;
++++stream.pipe(res);
}|code-block|syntax|javascript|2890133|entityMap^0|1|7|0|8|G|0|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@$9|U|A|V|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|W|8|@$9|X|A|Y|B|H]]|D|@]|E|$]]|$1|I|3|J|5|6|7|Z|8|@]|D|@]|E|$]]|$1|K|3|L|5|6|7|10|8|@]|D|@]|E|$]]|$1|M|3|N|5|O|7|11|8|@]|D|@]|E|$P|Q]]|$1|R|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|S|$]]

i had the same problem, running on a node.js server. the problem was not coming from my navigator, but from the server ! 
i was simply using the <code>fs.readFile(...)</code> function. this was enough for little files (i used 10ko max), but my fonts files where about 150ko, which was wayyy too much for all of this asynchronysation stuff :/ 
i solved this problem using a stream : 
(data is sent as it is read by the stream)
<pre><code>const stream = fs.createFileStream(filename);

stream.on(&quot;error&quot;, () =&gt; {
 // error : file does not exist, etc.
 res.setHeader(&quot;content-type&quot;, &quot;text/plain&quot;);
 res.statusCode = 404;
 res.end(&quot;ouuups, problem :/&quot;);
}

stream.on(&quot;open&quot;, () =&gt; {
 // good
 res.setHeader(&quot;content-type&quot;, mime);
 // mime is your font / file mime-type
 res.statusCode = 200;
 stream.pipe(res);
}
</code></pre>

I am doing assets pre-compile, and running the application in production mode. After compilation when I load the my index page I got followings warnings in the chrome console:

<pre><code>Failed to decode downloaded font: http://localhost:3000/fonts/ionicons.ttf?v=2.0.0
prospects:1 OTS parsing error: invalid version tag
Failed to decode downloaded font: http://localhost:3000/fonts/ionicons.woff?v=2.0.0
prospects:1 OTS parsing error: invalid version tag
</code></pre>

The issue is its not loading icons instead of that its showing squares.

we used the custom fonts and the code is:

<pre><code>@font-face {
 font-family: 'icomoon';
 src: font-url('icomoon.eot');
 src: font-url('icomoon.eot?#iefix') format('embedded-opentype'),
 font-url('icomoon.ttf') format('truetype'),
 font-url('icomoon.woff') format('woff'),
 font-url('icomoon.svg#icomoon') format('svg');
 font-weight: normal;
 font-style: normal;
}
</code></pre>

I don't know what is missing from my end . I searched a lot and also tried solution but not got any success.In development mode its working fine but don't know why its showing square in the production mode.

Failed to decode downloaded font, OTS parsing error: invalid version tag + rails 4

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋 

腾讯云代码助手

CODING DevOps

Cloud Studio

SDK中心

API中心

命令行工具

我正在进行assets预编译，并在生产模式下运行应用程序。编译后，当我加载我的索引页面时，我在chrome控制台中得到了以下警告：Failed to decode downloaded font: http://localhost:3000/fonts/ionicons.ttf?v=2.0.0prospects:1 O...

问无法解码下载的字体，OTS解析错误:无效的版本标签+ rails 4
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问无法解码下载的字体，OTS解析错误:无效的版本标签+ rails 4EN