這篇文章將為大家詳細講解有關webpack的tree shaking的實現(xiàn)，文章內容質量較高，因此小編分享給大家做個參考，希望大家閱讀完這篇文章后對相關知識有一定的了解。

創(chuàng)新互聯(lián)網站建設公司一直秉承“誠信做人，踏實做事”的原則，不欺瞞客戶，是我們最起碼的底線！ 以服務為基礎，以質量求生存，以技術求發(fā)展，成交一個客戶多一個朋友！專注中小微企業(yè)官網定制，成都網站制作、網站建設、外貿網站建設，塑造企業(yè)網絡形象打造互聯(lián)網企業(yè)效應。

webpack的tree shaking

util.js

export const a = () => {
 console.log("a123456方法");
};
export const b = () => {
 console.log("b123456方法");
};

main.js

import {a} from './utils';
a();

sideEffects

一般而言，上述代碼，在 webpack 進行 tree shaking 能夠不打包 function b 的代碼，這是因為 webpack 對代碼進行了分析， b 沒有引用不會打包。

但是npm包中，通過這種方式去引用，你會發(fā)現(xiàn) tree shaking 并沒有生效， 這是因為webpack無法識別你的代碼是否存在副作用，故而無法執(zhí)行tree shaking ，解決方法是給你的npm包 package.json 加上 sideEffects: false ，告訴webpack是無副作用的， webpack 可以放心處理。

什么是副作用( side effect )，即你的函數(shù)會對外部變量造成影響，比如

function a() {}
a.location = window.location
a.location.hash = 'll'

關于webpack的tree shaking的實現(xiàn)就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。

分享題目：webpack的treeshaking的實現(xiàn)
網頁URL：http://www.chinadenli.net/article10/gccgdo.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供關鍵詞優(yōu)化、企業(yè)網站制作、品牌網站建設、App開發(fā)、做網站、網站設計公司

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)