成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

webpack4 Mode的默認(rèn)設(shè)置

wua_wua2012 / 937人閱讀

摘要：功能強大，有很多獨特的功能，但其中一個難點是配置文件。為此團隊改變了這一現(xiàn)狀默認(rèn)不需要配置文件。每個選項的默認(rèn)配置如下指兩個配置項都存在的屬性中解決了的會被刪除刪除空的合并重復(fù)的調(diào)試緩存模塊避免在未更改時重建它們。

webpack功能強大，有很多獨特的功能，但其中一個難點是配置文件。為此,webpack團隊改變了這一現(xiàn)狀：webpack 4默認(rèn)不需要配置文件。可以通過mode選項為webpack指定一些默認(rèn)的配置。mode分為development/production,默認(rèn)為production。每個選項的默認(rèn)配置如下(common指兩個配置項都存在的屬性):

common 
//parent chunk中解決了的chunk會被刪除
optimization.removeAvailableModules:true
//刪除空的chunks
optimization.removeEmptyChunks:true
//合并重復(fù)的chunk
optimization.mergeDuplicateChunks:true

development

//調(diào)試
devtool:eval
//緩存模塊, 避免在未更改時重建它們。
cache:true
//緩存已解決的依賴項, 避免重新解析它們。
module.unsafeCache:true
//在 bundle 中引入「所包含模塊信息」的相關(guān)注釋
output.pathinfo:true
//在可能的情況下確定每個模塊的導(dǎo)出,被用于其他優(yōu)化或代碼生成。
optimization.providedExports:true
//找到chunk中共享的模塊,取出來生成多帶帶的chunk
optimization.splitChunks:true
//為 webpack 運行時代碼創(chuàng)建多帶帶的chunk
optimization.runtimeChunk:true
//編譯錯誤時不寫入到輸出
optimization.noEmitOnErrors:true
//給模塊有意義的名稱代替ids
optimization.namedModules:true
//給模chunk有意義的名稱代替ids
optimization.namedChunks:true

production

//性能相關(guān)配置
performance:{hints:"error"....}
//某些chunk的子chunk已一種方式被確定和標(biāo)記,這些子chunks在加載更大的塊時不必加載
optimization.flagIncludedChunks:true
//給經(jīng)常使用的ids更短的值
optimization.occurrenceOrder:true
//確定每個模塊下被使用的導(dǎo)出
optimization.usedExports:true
//識別package.json or rules sideEffects 標(biāo)志
optimization.sideEffects:true
//嘗試查找模塊圖中可以安全連接到單個模塊中的段。- -
optimization.concatenateModules:true
//使用uglify-js壓縮代碼
optimization.minimize:true

webpack運行時還會根據(jù)mode設(shè)置一個全局變量process.env.NODE_ENV,這里的process.env.NODE_ENV不是node中的環(huán)境變量,而是webpack.DefinePlugin中定義的全局變量,允許你根據(jù)不同的環(huán)境執(zhí)行不同的代碼.


例如:

if(process.env.NODE_ENV === "development"){
    //開發(fā)環(huán)境 do something
}else{
    //生產(chǎn)環(huán)境 do something
}

最終將編譯成

if(true){
   //開發(fā)環(huán)境 do something
}else{
   //生產(chǎn)環(huán)境 do something
}

生產(chǎn)環(huán)境下,uglify打包代碼時會自動刪除不可達代碼,也就是說生產(chǎn)環(huán)境壓縮后最終的代碼為:

  //生產(chǎn)環(huán)境 do something

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/93401.html

相關(guān)文章

  • webpack4新特性介紹

    摘要：當(dāng)下最流行的模塊打包器于年月日正式發(fā)布版本，代號。從官方的發(fā)布日志來看本次大版本更新帶來了很多新特性更新和改善，這將會讓的配置更加簡單。本文，筆者將會全面介紹的新特性及實踐。只支持模塊，目前處于試驗階段。 導(dǎo)語: webpack是一個JS應(yīng)用打包器, 它將應(yīng)用中的各個模塊打成一個或者多個bundle文件。借助loaders和plugins，它可以改變、壓縮和優(yōu)化各種各樣的文件。它的輸入...

    NotFound 評論0 收藏0

  • webpack4.0初體驗、各版本及parcel性能對比

    摘要：前段時間又發(fā)布了新版本我接觸的時候已經(jīng)版本了支持的版本必須打包速度大小比較以及粗淺的試了一下下圖所示，黃色為版本綠色為我寫的配置，跟基本相似，具體不同下面會介紹藍色是自帶的模式紅色為具體大小速度大家可以比較一下，還是很給力的關(guān)于配置方面，應(yīng) 前段時間webpack又發(fā)布了新版本webpack4我接觸的時候已經(jīng)4.1版本了node支持的版本必須node: >=6.11.5 webpack...

    MarvinZhang 評論0 收藏0

  • webpack4 配置解析和實戰(zhàn)

    摘要：特性比較熱門的兩大特性，零配置和速度快號稱提速上限一般情況下，相比于低版本，場景下第三方依賴打包速度和場景下本地服務(wù)首次啟動速度都得到顯著提升零配置通過指定當(dāng)前場景為開發(fā)模式還是生產(chǎn)模式，自動設(shè)置好當(dāng)前場景的默認(rèn)配置，用戶即可馬上使用，不需 webpack4特性 webpack4比較熱門的兩大特性，零配置和速度快（號稱提速上限98%） 一般情況下，webpack4相比于低版本，prod...

    王笑朝 評論0 收藏0

  • 如何優(yōu)雅的升級到 webpack4

    摘要：默認(rèn)出入口在中，不再強制要求指定和路徑。構(gòu)建模式提供了兩種構(gòu)建模式可供選擇和選項描述會將的值設(shè)為。如果是，那就會開啟。默認(rèn)只會對按需加載的代碼做分割。在或更低版本中，如果你想為一個推導(dǎo)出來的定制選項，你不得不在自己的選項中將它重復(fù)一遍。 前言 現(xiàn)在距離2018年2月15號webpack4.0.0出來已經(jīng)有一段時間了，現(xiàn)在已經(jīng)出了 @vue/cli 3.0，但是樓主還沒試過，聽說很強大，...

    zhangfaliang 評論0 收藏0

  • [email protected]研究筆記【02】- mode

    摘要：簡介模式是新增的配置，用來指定使用對應(yīng)模式的內(nèi)置優(yōu)化它有三個可選模式默認(rèn)為。源碼地址選項描述通過插件將的值設(shè)為。啟用和通過插件將的值設(shè)為。使用默認(rèn)的優(yōu)化項。注意上面說的并不是的運行環(huán)境變量，它其實是通過插件設(shè)置的一個全局變量。 簡介 ? mode（模式）是webpack4.0.0新增的配置，用來指定webpack使用對應(yīng)模式的內(nèi)置優(yōu)化；它有三個可選模式：producti...

    newtrek 評論0 收藏0

發(fā)表評論

0條評論

wua_wua2012

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<