前端壓縮字體文件---成功


一、踩坑過程

1、網上在線壓縮,壓縮后只有1-10KB,網頁引用不起作用

2、下載壓縮工具,由於字體過大,壓縮過程直接會中斷

3、Font-Spider (字蛛) ----成功(仍有不足)

二、壓縮文件准備

 

 font文件夾只有一個ttf格式的文字文件,global.min.css里@font-face{} 里必須要有ttf格式文字引用,其他的格式按照自己的需要引用【壓縮過程會自動生成,不需要去下載其他格式】

三、Font-Spider (字蛛)壓縮過程

1、全局安裝Font-Spider

  window+r 【進入小黑窗口】

  npm install font-spider -g【全局安裝Font-Spider,前提已安裝node】

  font-spider -V (大寫的V)【查看版本號,】

2、開始壓縮

  font-spider C:\Users\12485\Desktop\luckySummer\*html

  

  

3、壓縮前后文件對比

        

 

          

  *******css里每次只引用一個字體文件,壓縮時只壓縮一個字體文件,不要引用多個一起壓縮,我倆個一起壓縮時總會有一個壓縮的特別小,只有6K,網頁引用不起作用

  字體文件只需准備.ttf格式,需要其他格式字體兼容不同瀏覽器的話就在css里寫上,壓縮后會自動生成。

  font-spider是自動生成的文件夾,保留未被壓縮的原版字體包

  *** .otf格式字體壓縮不了

 

四、Font-Spider (字蛛)壓縮缺陷

  字蛛是檢測已有文字壓縮【protal.html里的字】,如果protal.html里的文字不全,我們把壓縮后的字體用於項目中后,會導致未被壓縮的字依然顯示的是系統默認字體。

  我最后是把符號、數字、常用的2500字漢字都寫進protal.html里進行壓縮,壓縮后是550KB左右。

我目前沒有找到更好的辦法,項目中暫時就先用字蛛壓縮的字體

-----------------大家有好的辦法可以留言。。。。。感謝------------------


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM