總結:
tree-shaking
optimization.usedExports是否開啟標記無用js函數(shù)代碼為/*unused harmony exports*/
optimization.sideEffect 表示是否開啟tree-shaking功能
測試環(huán)境默認關閉標記播掷,不會標記并刪除無用js函數(shù),且
optimization.minimize為false不開啟壓縮亭螟,optimization.sideEffect為flag,不開啟tree-shaking
生產(chǎn)環(huán)境開啟標記沈跨,optimization.minimize為true,?optimization.sideEffect為true開啟tree-shaking
只有esm模塊代碼才能被tree-shaking
package.json中默認sideEffects屬性true
package中sideEffects設置為false或者數(shù)組鲜侥,無論是否開啟tree-shaking,都會刪除未用到的js函數(shù)
所以項目package.json中默認sideEffects為true實現(xiàn)正確的tree-shaking
通常第三方包設置標記sideEffects:false粥谬,避免其他人引入該包無用js或者css代碼
若不設置sideEffects即為true
測試環(huán)境中不會剔除掉無用的js函數(shù)儒陨,?保留import引入的css文件和js加載、事件等代碼
生產(chǎn)環(huán)境默認開啟剔除無用js函數(shù)回论,且最優(yōu)化剔除未使用到的js函數(shù)浩姥,會保留import引入的css文件和js加載挑随、事件等代碼
若設置sideEffects為false
項目所有文件無副作用,會刪除有用的import引入的css文件和js加載勒叠、事件等代碼及未使用到函數(shù)
若設置sideEffects數(shù)組["css/**.css"]
項目中數(shù)組內(nèi)的文件有副作用兜挨,不會刪除有用的import引入的css文件和js加載、事件等代碼眯分,會剔除未使用到的函數(shù)拌汇;其他的文件都無副作用,會刪除有用的import引入的css文件和js加載弊决、事件等代碼及未使用到的函數(shù)