動漫人物
2022-11-27 15:51:44
我們的代碼依賴于streamlinehq/streamline-regularjavascript 包。這個包既是第三方的又是專有的,這意味著我們不能分叉它也不能編輯它。我們有這樣的debug.js示例代碼:import MessagesSpeechBubbles from '@streamlinehq/streamline-regular/lib/messages-chat-smileys/MessagesSpeechBubbles';
window.console.log(MessagesSpeechBubbles.MessagesBubbleSquareText);查看 MessagesSpeechBubbles js 文件,它正在為每種不同類型的對話氣泡導(dǎo)出帶有 SVG 數(shù)據(jù)的大量默認(rèn)對象,縮小后總計 50kb。作為參考,請參閱捆綁分析的輸出:有什么方法可以部分導(dǎo)入或引入這個對象,這樣在被webpack打包后,只有MessagesBubbleSquareText對象的一部分被包含在最終的包中?本質(zhì)上,有沒有什么方法可以通過只包含我們實際使用的 SVG 數(shù)據(jù)來縮小我們的生產(chǎn)包?
2 回答

肥皂起泡泡
TA貢獻(xiàn)1829條經(jīng)驗 獲得超6個贊
在 javascript 中沒有辦法用某種 tree shaking 來分割對象。Tree shaking 只能使生產(chǎn)包中只包含必要的對象和函數(shù),但如果您導(dǎo)入了一個巨大的“mega object”,它不能只包含其中的一部分。
為了使您的庫實用,重要的是編寫它們以導(dǎo)出許多小對象,而不是一個巨大的默認(rèn)對象。

Smart貓小萌
TA貢獻(xiàn)1911條經(jīng)驗 獲得超7個贊
我在那里沒有帳戶,但如果他們以正確的方式實施 tree shaking,你可以嘗試:
import { MessagesBubbleSquareText } from '@streamlinehq/streamline-regular';
window.console.log(MessagesBubbleSquareText);
或類似的東西。不知道導(dǎo)入是如何工作的,因為我找不到這個 npm 包的 gitrepo
添加回答
舉報
0/150
提交
取消