Saya melakukan aset pre-compile, dan menjalankan aplikasi dalam mode produksi. Setelah kompilasi ketika saya load saya halaman indeks aku punya hal-hal sebagai berikut peringatan di chrome console:
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
Masalah yang tidak memuat ikon bukan yang menunjukkan kotak.
kami menggunakan font kustom dan kode ini:
@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;
}
Saya don't tahu apa yang hilang dari akhir saya . Aku mencari banyak dan juga mencoba solusi, tetapi tidak mendapat hasil apapun.Dalam perkembangan mode yang bekerja dengan baik tapi don't tahu mengapa yang menunjukkan square di produksi mode.
Aku punya kesalahan yang sama persis, dan dalam kasus saya ternyata karena jalan yang salah untuk @font-face
deklarasi. Web inspector tidak pernah mengeluh dengan 404 sejak dev server kami're menggunakan (live server) dikonfigurasi untuk melayani default index.html pada setiap 404:s. Tanpa mengetahui rincian tentang pengaturan anda, ini bisa menjadi pelakunya.
Jika berjalan pada IIS sebagai server dan .net 4/4.5 mungkin akan hilang mime / ekstensi file definisi di Web.konfigurasi seperti ini:
<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+xml" />
<remove fileExtension=".woff" />
<mimeMap fileExtension=".woff" mimeType="application/font-woff" />
</staticContent>
</system.webServer>
Saya sedang mengalami masalah yang sama., OTS parsing error: Gagal mengkonversi WOFF 2.0 font untuk SFNT (index):1 Gagal untuk memecahkan kode-download font: http://dev.xyz/themes/custom/xyz_theme/fonts/xyz_rock/rocksansbold/Rock-SansBold.woff2
Jika anda mendapat pesan kesalahan ini ketika mencoba untuk melakukan font anda maka itu adalah sebuah masalah .gitattributes
"peringatan: CRLF akan digantikan oleh LF
"
Solusi untuk ini adalah menambahkan apapun jenis huruf anda mendapatkan masalah dengan dalam .gitattributes
*.ttf -text diff
*.eot -text diff
*.woff -text diff
*.woff2 -text diff
Kemudian saya dihapus korup file font dan diterapkan kembali baru file font dan bekerja hebat.
mencoba
@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;
}
dan mengubah nama file application.css.scss
Saya memiliki masalah yang sama dan itu karena git mengobati file-file sebagai teks. Jadi saat memeriksa file dalam membangun agen, binary itu tidak dipertahankan.
Tambahkan ini untuk anda .gitattributes
file dan mencoba.
*.eot binary
*.ttf binary
*.woff binary
*.woff2 binary
Ketika menggunakan sudut-cli
, ini adalah apa yang bekerja untuk saya:
<?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+xml" />
<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="^(?!.*(.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)).*$" />
<conditions logicalGrouping="MatchAll">
</conditions>
<action type="Rewrite" url="/" appendQueryString="true" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
Saya mendapatkan kesalahan berikut:
Failed to decode downloaded font: [...]/fonts/glyphicons-halflings-regular.woff2
OTS parsing error: invalid version tag
yang tetap setelah men-download file mentah langsung dari:
https://github.com/twbs/bootstrap/blob/master/fonts/glyphicons-halflings-regular.woff2
Masalahnya adalah bahwa ada proxy kesalahan saat men-download file (terdapat pesan kesalahan HTML).
Pergi ke alamat di bawah ini di GitHub dan download masing-masing FontAwesome file.
https://github.com/FortAwesome/font-awesome-sass/tree/master/assets/fonts/font-awesome
...tapi bukannya mengklik kanan dan menyimpan link, klik pada masing-masing file dan menggunakan 'Download' tombol untuk menyelamatkan mereka.
Saya menemukan bahwa penghematan link download halaman HTML dan tidak FontAwesome file biner itu sendiri.
Setelah saya memiliki semua binari itu bekerja untuk saya.
Untuk sudut-cli dan webpack pengguna saya menduga bahwa ada beberapa masalah ketika mengimpor font di file css , jadi silakan juga memberikan lokasi url dikodekan dengan tanda kutip tunggal sebagai berikut -
@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;
}
Posting ini mungkin menjadi tua , tapi ini adalah solusi yang bekerja untuk saya .
Aku punya masalah yang sama ketika saya dibuka dan disimpan .woff
dan .woff2
file melalui Sublime Text dengan EditorConfig
pilihan end_of_line = lf
.
Aku hanya menyalin file ke folder font tanpa membuka mereka menjadi Luhur dan masalah ini diselesaikan.
Periksa jenis huruf's file css. (fontawesome.css/fontawesome.min.css), anda akan melihat seperti ini:
@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
}
anda akan melihat versi tag setelah huruf's nama ekstensi file. Seperti:
-v=4.6.3
Anda hanya perlu untuk menghapus tag dari file css. Setelah menghapus ini, anda perlu pergi ke folder font anda, Dan anda akan melihat:
Dan, Bentuk ini jenis huruf's file, anda hanya perlu menghapus versi tag -v=4.6.3 dari nama file.
Kemudian, masalah akan sloved.
I've punya masalah yang sama.
Menambahkan font versi (misalnya ?v=1.101
) untuk font URL harus melakukan trik ;)
@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 */
}
Klik (klik kanan mouse) pada huruf's TTF versi dan memilih "Mendapatkan Info" (Mac OSX) "Sifat" (Windows) di konteks menu harus cukup untuk mengakses font versi.
Jika jawaban yang lain tidak't bekerja coba:
# Font
# Tambahkan konten yang benar-jenis font
AddType application/vnd.ms-fontobject .eot
AddType application/x-font-ttf .ttf
AddType application/x-font opentype .otf
AddType application/x-font woff .woff
AddType application/x-font-woff2 .woff2
AddType gambar/svg+xml .svg