詳解node字體壓縮插件font-spider的用法
更新時間：2018年09月28日 11:48:04 投稿：laozhang
在本篇文章中給大家詳細(xì)講述了node字體壓縮插件font-spider的用法的相關(guān)知識點內(nèi)容，有需要的朋友參考下。
需求：
根據(jù)甲方要求，使用UI中指定字體
移動端默認(rèn)顯示系統(tǒng)默認(rèn)字體，非系統(tǒng)默認(rèn)字體需要自行引入字體包
字體包過大，字體包通常在幾MB，嚴(yán)重拖累頁面加載速度
分析：
文本內(nèi)容為固定內(nèi)容，不需要更新
文本內(nèi)容大多為常用文字，大多文字用不上
插件：
font-spider node 安裝插件方法：npm install font-spider -g
操作：
安裝插件
提取項目文字：
創(chuàng)建一個臨時html，將所有項目需要用到的文本放到html中
在htmnl中寫入樣式代碼，舉個栗子：
@font-face {
font-family: 'myfont';
src: url('./common/assets/font/myfont.ttf');
}
* {
font-family: 'myfont';
}
在命令提示窗口中，將目錄展開到html所在的目錄，輸入指令：font-spider *.html 即可將該目錄下所有html的字體抽離打包。
注意：
如果頁面文本內(nèi)容需要經(jīng)常更新
如果需要對input表單內(nèi)容同樣應(yīng)用定制字體請放棄本文章所述方法，可以考慮通過服務(wù)端渲染，動態(tài)生成字體包，或者，老老實實將完整的字體包引入頁面
相關(guān)文章
這篇文章主要介紹了簡述pm2常用命令集合及配置文件說明,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
node 文件上傳接口的轉(zhuǎn)發(fā)的實現(xiàn)
這篇文章主要介紹了node 文件上傳接口的轉(zhuǎn)發(fā)的實現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09
node.js使用express-fileupload中間件實現(xiàn)文件上傳
本文使用express作為服務(wù)端，使用express-fileupload庫提供的中間件函數(shù)來接受從客戶端傳來的圖片，并將圖片作為文件存儲在服務(wù)端，感興趣的可以了解一下2021-07-07
package.json與package-lock.json創(chuàng)建及使用詳解
這篇文章主要為大家介紹了package.json與package-lock.json創(chuàng)建及使用詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-07-07
下面小編就為大家?guī)硪黄猲odejs 搭建簡易服務(wù)器的圖文教程(推薦)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-07-07
在Node.js開發(fā)過程中,npm install 是安裝和管理項目依賴的關(guān)鍵命令,然而,有時我們會遇到 npm install 運行卡住不動的情況,本文將為你提供七種解決方案,幫助你順利進(jìn)行依賴安裝,需要的朋友可以參考下2024-07-07
因為nodejs是單線程的,所以一旦發(fā)生錯誤或異常,如果沒有及時被處理整個系統(tǒng)就會崩潰。下面這篇文章主要給大家介紹了關(guān)于Node錯誤處理筆記之挖坑系列的相關(guān)資料，需要的朋友可以參考借鑒，下面來一起看看吧2018-06-06
nodejs轉(zhuǎn)換音頻文件格式并壓縮導(dǎo)出zip格式(vscode語音插件開發(fā))
FFmpeg是一套開源的音視頻處理工具，通俗地講，可以對音視頻文件進(jìn)行剪切、拼接、水印、轉(zhuǎn)碼等處理，這篇文章主要介紹了nodejs轉(zhuǎn)換音頻文件格式并壓縮導(dǎo)出zip格式(vscode語音插件開發(fā)),需要的朋友可以參考下2023-05-05
阿里大于短信驗證碼node koa2的實現(xiàn)代碼(最新)
本文給大家分享一個最新版阿里大于短信驗證碼node koa2的實現(xiàn)代碼及注意事項，需要的朋友參考下吧2017-09-09
這篇文章主要給大家介紹了關(guān)于如何利用nodejs實現(xiàn)命令行游戲的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11