webpack中的模式(mode)使用詳解
模式(mode)
提供 mode 配置選項，告知 webpack 使用相應模式的內置優(yōu)化。
用法
只在配置中提供 mode 選項：
module.exports = {
mode: 'production'
};
或者從 CLI 參數(shù)中傳遞：
webpack --mode=production
支持以下字符串值：
1.development
會將 process.env.NODE_ENV 的值設為 development。啟用 NamedChunksPlugin 和 NamedModulesPlugin。
// webpack.development.config.js
module.exports = {
+ mode: 'development'
- plugins: [
- new webpack.NamedModulesPlugin(),
- new webpack.DefinePlugin({ "process.env.NODE_ENV": JSON.stringify("development") }),
- ]
}
2.production
會將 process.env.NODE_ENV 的值設為 production。啟用 FlagDependencyUsagePlugin, FlagIncludedChunksPlugin, ModuleConcatenationPlugin, NoEmitOnErrorsPlugin, OccurrenceOrderPlugin, SideEffectsFlagPlugin 和 UglifyJsPlugin.
// webpack.production.config.js
module.exports = {
+ mode: 'production',
- plugins: [
- new UglifyJsPlugin(/* ... */),
- new webpack.DefinePlugin({ "process.env.NODE_ENV": JSON.stringify("production") }),
- new webpack.optimize.ModuleConcatenationPlugin(),
- new webpack.NoEmitOnErrorsPlugin()
- ]
}
production模式下會啟用UglifyJsPlugin插件（移除未使用的內容和文件壓縮），分別用production和development打包，編譯的區(qū)別：
1.development打包后，一些沒有依賴的方法 變量 文件會保留，production則會移除。
2.production打包后，代碼會進行壓縮，比development的文件小。
到此這篇關于webpack中的模式(mode)使用詳解的文章就介紹到這了,更多相關webpack 模式內容請搜素腳本之家以前的文章或下面相關文章，希望大家以后多多支持腳本之家！
相關文章
javascript移出節(jié)點removeChild()使用介紹
這篇文章主要介紹了javascript節(jié)點操作移出節(jié)點removeChild()的使用,需要的朋友可以參考下2014-04-04
詳解JavaScript實現(xiàn)繼承的五種經典方式(附圖解)
JavaScript中的繼承是一種機制,通過它可以創(chuàng)建一個對象,該對象可以享有另一個對象的屬性和方法,本文將詳細的為大家介紹實現(xiàn)繼承的五種經典方式,感興趣的小伙伴跟著小編一起來看看吧2023-08-08
經常在一些博客中看到有一個打賞功能，本篇文章主要介紹了博客打賞功能，具有一定的參考價值，感興趣的小伙伴們可以參考一下。2016-10-10
任何一種編程語言的簡寫小技巧都是為了幫助你寫出更簡潔、更完善的代碼,讓你用更少的編碼實現(xiàn)你的需求,這篇文章主要給大家介紹了關于javascript代碼簡寫的幾種常用方式,需要的朋友可以參考下2021-08-08
swiper組件是滑塊視圖容器,這篇文章主要給大家介紹了關于微信小程序swiper-dot中的點如何改成滑塊的相關資料,實現(xiàn)以后的效果還是不錯的,需要的朋友可以參考下2021-07-07
理解JavaScript中的事件...2006-09-09
Javascript構造函數(shù)是非常強大的,它可能也是Javascript能被充分利用的特點之一,文中通過實例代碼介紹的非常詳細,這篇文章主要給大家介紹了關于JavaScript構造函數(shù)的相關資料,需要的朋友可以參考下2023-04-04
這篇文章主要為大家介紹了JS的數(shù)組方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2021-11-11
這篇文章主要為大家詳細介紹了JS實現(xiàn)網站換膚，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-07-07
JavaScript中的Array 對象（數(shù)組對象）
Array 對象用于在單個的變量中存儲多個值。2016-06-06