webpack的treeshaking的實(shí)現(xiàn)
這篇文章將為大家詳細(xì)講解有關(guān)webpack的tree shaking的實(shí)現(xiàn)，文章內(nèi)容質(zhì)量較高，因此小編分享給大家做個(gè)參考，希望大家閱讀完這篇文章后對(duì)相關(guān)知識(shí)有一定的了解。
創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司一直秉承“誠(chéng)信做人，踏實(shí)做事”的原則，不欺瞞客戶，是我們最起碼的底線！ 以服務(wù)為基礎(chǔ)，以質(zhì)量求生存，以技術(shù)求發(fā)展，成交一個(gè)客戶多一個(gè)朋友！專注中小微企業(yè)官網(wǎng)定制，成都網(wǎng)站制作、網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)，塑造企業(yè)網(wǎng)絡(luò)形象打造互聯(lián)網(wǎng)企業(yè)效應(yīng)。
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 進(jìn)行 tree shaking 能夠不打包 function b 的代碼，這是因?yàn)?nbsp;webpack 對(duì)代碼進(jìn)行了分析， b 沒有引用不會(huì)打包。
但是npm包中，通過這種方式去引用，你會(huì)發(fā)現(xiàn) tree shaking 并沒有生效， 這是因?yàn)閣ebpack無法識(shí)別你的代碼是否存在副作用，故而無法執(zhí)行tree shaking ，解決方法是給你的npm包 package.json 加上 sideEffects: false ，告訴webpack是無副作用的， webpack 可以放心處理。
什么是副作用( side effect )，即你的函數(shù)會(huì)對(duì)外部變量造成影響，比如
function a() {}
a.location = window.location
a.location.hash = 'll'關(guān)于webpack的tree shaking的實(shí)現(xiàn)就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，可以學(xué)到更多知識(shí)。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到。
網(wǎng)頁(yè)題目：webpack的treeshaking的實(shí)現(xiàn)
轉(zhuǎn)載注明：http://m.jiaotiyi.com/article/gccgdo.html