webpack5新特性中文翻譯

前言

都是我從官方文檔裏拼本身理解翻譯過來的,藉助翻譯工具應該大概解析出來,可是能力強的仍是建議直接查看文檔,畢竟我也不強,怕誤導意思javascript

changelog-v5css

大方向

這一發布集中在如下方面:html

  • 咱們嘗試經過持久緩存來提升構建性能。
  • 咱們嘗試用更好的算法和默認值來改進長期緩存。
  • 咱們試圖經過更好地Tree Shaking和生成代碼來改進bundle(捆綁包)的大小。
  • 咱們試圖改進對web平臺的兼容性。
  • 在實現v4中的特性而不引入任何破壞性更改的同時,咱們試圖清理處於奇怪狀態的內部結構。
  • 咱們試圖經過如今引入破壞性的更改來爲未來的特性作準備,讓咱們儘量長時間地停留在v5上。

遷移指南

=> see here for a migration guide <=前端

重大變化:刪除

移除已棄用的功能

全部在v4中被廢棄的功能都被移除。java

遷移: 確保你的webpack4項目沒有打印棄用警告node

這也有一些被廢棄可是在v4中沒有打印警告的東西react

  • IgnorePlugin 和 BannerPlugin 如今只能經過一個參數傳遞,它能夠是一個對象,字符串或者函數

廢棄代碼

新的廢棄包括一個依賴代碼以便於他們更容易被引用webpack

廢棄語法

require.include已經被廢棄,當使用的時候會默認發出警告git

可使用Rule.parser.requireInclude去改變行爲: 容許, 廢棄或者禁止github

移除Nodejs自動引入Polifills

在早期的時候,webpack的目標是容許大多數的nodejs模塊在瀏覽器中運行,可是隨着模塊格局的改變,如今許多的模塊使用都是爲了前端的目的而編寫,v<=4爲許多的nodejs核心模塊提供填充,一旦一個模塊使用了任何的核心模塊就會自動應用這些填充(i.e. the crypto module).

雖然這使使用爲nodejs而編寫的模塊變得更簡單,可是它添加了巨大的填充到bundle中,但大多數狀況下它們並非必要的

v5中止自動填充這些模塊而專一於前端兼容模塊

遷移:

  • 儘量使用前端兼容模塊
  • 能夠手動給nodejs核心模塊添加填充,一個錯誤消息將給出如何實現這一點的提示。
  • 包做者: 使用package中的browser字段讓包兼容,爲瀏覽器提供替代的實現/依賴關係

主要變化:長期緩存

Deterministic Chunk, Module IDs and Export names

新增新的算法去實現長期緩存.這在生產環境被默認啓用

chunkIds: "deterministic", moduleIds: "deterministic", mangleExports: "deterministic"

這算法以肯定的方式將短(3或4字節)數字IDs分配給模塊和快,短(2字節)名稱分配給導出,這是在塊體積和長期緩存之間的權衡.

moduleIds/chunkIds/mangleExports: false禁止默認行爲,能夠經過插件提供自定義算法。.注意在v4中moduleIds/chunkIds: false沒有自定義插件進行工做構建,而在v5你必須提供一種

遷移: 最好是使用chunkIds, moduleIds andmangleExports,你也能夠選擇性使用舊的默認值: chunkIds: "size", moduleIds: "size", mangleExports: "size",這會生成更小的塊,可是更常讓長期緩存失效

注意: 在v4哈希模塊id下降了gzip的性能,這與更改的模塊命令有關,已經被修復了

注意: 在v5deterministicid在生產環境默認被啓用

Real Content Hash

v5如今當使用[contenthash]會使用文件內容的真正散列,在此以前只是使用內部結構的散列,這隻有在註釋改變或者變量重命名纔會對長期緩存產生積極影響.而這些更改在壓縮以後是不可見的

主要變化:開發支持

Named Chunk IDs

開發模式中默認啓用的新命名塊id算法爲塊(和文件名)提供可讀的名稱。模塊ID是由其相對於上下文的路徑決定的。塊ID由塊的內容決定。

這樣你就不用再用import(/* webpackChunkName: "name" */ "module")去調試,可是,若是您但願爲生產環境控制文件名,那麼它仍然是有意義的。

在生產環境中可使用 chunkIds:「named」,但要確保不要意外地暴露有關模塊名稱的敏感信息。

遷移:若是您不喜歡在開發中更改文件名,您能夠經過 chunkIds: "natural"來使用舊的數字模式。

Module Federation

Webpack 5增長了一個名爲「模塊聯合」的新特性,它容許多個Webpack構建版本一塊兒工做。從運行時的角度來看,造成多個構建的模塊就像一個巨大的鏈接模塊圖。從開發人員的指望模塊能夠從指定的遠程構建導入和使用最小的限制。

For more details see this separate guide.

主要變化:新的網絡平臺功能

JSON模塊

JSON模塊如今與規範一致,若是使用了非默認導出會發出警告.JSON模塊從嚴格的EcmaScript模塊導入的時候再也不有命名導出

遷移: 使用默認導出

優化optimization.usedExports刪除未使用的屬性,優化optimization.mangleExports沒有邏輯的屬性

能夠在Rule.parser.parse指定自定義的JSON序列化去引入類JSON文件(例如toml、yaml、json5等)。

Asset模塊

v5如今原生支持資源模塊,這些模塊要麼將文件發送到輸出文件夾中,要麼將DataUri注入到javascript包中。不管哪一種方式,它們都提供一個URL來使用。

它們可以經由多種方式使用

  • import url from "./image.png",當匹配這些引入的時候須要在module.rules設置type: "asset"
  • new URL("./image.png", import.meta.url)

所選擇的語法也容許在不使用bundler的狀況下運行代碼。

import.meta

  • import.meta.webpackHotmodule.hot 的別名,能夠在嚴格模式下執行
  • import.meta.webpack 是webpack的主版本號
  • import.meta.url 是當前文件的 file: url (相似 __filename不過是做爲文件路徑)

原生Worker支持

當將資源的新URL與 new Worker/new SharedWorker/navigator.serviceWorker.register 組合時。webpack將自動爲web worker建立一個新的入口點。

new Worker(new URL("./worker.js", import.meta.url))

所選擇的語法也容許在不使用bundler的狀況下運行代碼。

Uris

Webpack 5支持處理請求中的協議。

  • data: 支持Base64或者被支持的原始編碼. 在module.rulesMimetype能夠被映射到加載器和模塊類型 . 例如: import x from "data:text/javascript,export default 42"
  • file:支持
  • http(s): 支持, 但須要選擇經過 new webpack.experiments.schemesHttp(s)UriPlugin()

支持請求中的片斷:例如: ./file.js#fragment

異步模塊

v5支持所謂的"異步模塊", 這些模塊不是同步計算的,而是異步和基於promise的

經由import引入它們會被自動處理不須要額外的語法,並且幾乎不存在明顯的差別

經由require引入它們會返回promise導出解析

在webpack有多種使用異步模塊的方式

  • async externals
  • WebAssembly Modules in the new spec
  • EcmaScript Modules that are using Top-Level-Await

Externals

Webpack 5增長了額外的external類型以涵蓋更多的應用程序:

promise: 一種表達結果的承諾, 外部模塊是一個異步模塊,解析後的值用做模塊導出。

import: 原生import使用作加載指定的請求,而external模塊是一種異步模塊

script: 經由<script>加載一個url得到全局的導出變量(可選屬性), external模塊是一種異步模塊

主要變化:新的Node.js生態系統特性

Resolving

package.json中的 exportsimport字段如今支持。

Yarn PnP is supported natively.

See more details in TODO.

主要變化:開發經驗

Improved target

Webpack 5容許傳遞目標列表,也支持目標的版本。

例如: target: "node14" target: ["web", "es2020"]

這是一個提供webpack須要肯定的全部信息的簡單方法:

  • chunk loading mechnism, and
  • 支持像箭頭函數等語法

Stats

測試數據格式已經改進可讀性和冗長性,默認值已經獲得了改進,變得更簡潔,也更適合大型構建。

  • 默認隱藏chunk之間的關係. 能夠經過 stats.chunkRelations切換.
  • 如今的統計數據能夠區分 filesauxiliaryFiles .
  • 默認隱藏module 和chunk的id. 能夠經過 stats.ids切換.
  • 全部模塊的列表如今都是會按路徑到入口(distance to entrypoint)排序. 能夠經過 stats.modulesSort切換..
  • 全部chunk的列表如今都是會按模塊名排序. 能夠經過 stats.chunkModulesSort切換.
  • 在concatenated modules裏的全部內嵌模塊的列表如今都是會按topologically排序..能夠經過stats.nestedModulesSort切換.
  • Chunks 和Assets show chunk id 提示
  • Assets and modules 會顯示成 tree 取代 list/table.
  • 通常的資料如今在最後的摘要中顯示。它顯示webpack版本,配置名和警告/錯誤計數。
  • Hash默認隱藏. 能夠經過 stats.hash切換.
  • 構建時間戳默認再也不顯示. 能夠經過 stats.builtAt啓用. 它將在摘要中顯示時間戳。
  • 子compilations默認再也不顯示. 能夠顯示在stats.children.

Progress

CLI --progress 使用的`ProgressPlugin 已經作了一些改進,但也能夠做爲插件手動使用。

它過去只計算處理過的模塊。如今它能夠計算 entries dependencies and modules。全部這些如今都默認顯示。

它用於顯示當前處理的模塊。這致使了不少標準錯誤輸出,並在一些控制檯上產生了性能問題。如今默認狀況下禁用(activeModules選項)。這也減小了垃圾信息的數量在控制檯。如今,在構建模塊期間寫入標準錯誤的時間被限制爲500ms。

分析模式也獲得了升級,並將顯示嵌套進度消息的時間。這使得插件形成性能問題時更容易發現。

一種新的添加選項percentBy告訴ProgressPlugin怎麼計算進度比

new webpack.ProgressPlugin({ percentBy: "entries" });

爲了使進度百分比更準確,ProgressPlugin緩存最後已知的模塊總數,並在下一次構建中重用這個值。第一個版本將預熱緩存,但接下來的版本將使用並更新這個值。

Automatic unique naming

在webpack 4中,多個webpack運行時可能在同一個頁面上發生衝突,由於它們使用相同的全局變量來加載塊。要解決這個問題,須要爲輸出提供一個自定義名稱output.jsonpFunction配置。

Webpack 5會自動從package.json name推斷出構建的惟一名稱。並將其做爲output.uniqueName的默認值。

此值用於使全部潛在衝突的全局變量惟一。

遷移:考慮刪除output.jsonpFunction

Automatic public path

容許的狀況下v5會自動決定output.publicPath

Typescript typings

v5會從源碼生成Typescript typings經過npm包暴露

遷移:刪除@types/webpack。當名稱不一樣時更新引用。

重大變化:優化

Nested tree-shaking

webpack如今可以跟蹤訪問導出的嵌套屬性的訪問。這能夠在從新導出名稱空間對象時改進tree-shaking(消除未使用和混亂的導出)。

// inner.js
export const a = 1;
export const b = 2;

// module.js
import * as inner from "./inner";
export { inner }

// user.js
import * as module from "./module";
console.log(module.inner.a);

在本例中,能夠在生產模式中刪除導出b。

Inner-module tree-shaking

webpack 4沒有分析模塊導出和導入之間的依賴關係。webpack 5有一個新的選項優化optimization.innerGraph在生產模式中默認啓用,它對模塊中的符號運行分析,以找出從導出到導入的依賴關係。

像這種模塊

import { something } from "./something";

function usingSomething() {
  return something;
}

export function test() {
  return usingSomething();
}

內部圖算法將計算出只有在使用測試導出時才使用某些內容,這能夠標記更多未使用的導出而且從塊中刪除
當設置sideEffects": false會刪除更多的模塊,在這例子./something當測試模塊未使用會被刪除
須要配置optimization.unusedExports去得到更多關於未使用導出的信息
下面的符號會被分析

  • function declarations
  • class declarations
  • export default

    • with or variable declarations with
    • function expressions
    • class expressions
    • sequence expressions
    • /*#__PURE__*/ expressions
    • local variables
    • imported bindings

反饋:若是你發如今這個分析中有什麼缺失,請報告一個問題,咱們考慮增長它。

使用eval()將對模塊進行此優化,由於evaled代碼能夠引用範圍內的任何符號。

這種優化也稱爲深度範圍分析。

CommonJs Tree Shaking

webpack在分析CommonJs導出和require()調用時,能夠選擇不參加導出。

webpack 5增長了對一些CommonJs構造的支持,容許消除未使用的CommonJs導出,並從require()調用中跟蹤引用的導出名稱。

持如下構造:

  • exports|this|module.exports.xxx = ...
  • exports|this|module.exports = require("...") (reexport)
  • exports|this|module.exports.xxx = require("...").xxx (reexport)
  • Object.defineProperty(exports|this|module.exports, "xxx", ...)
  • require("abc").xxx
  • require("abc").xxx()
  • importing from ESM
  • require() a ESM
  • flagged exportType (special handling for non-strict ESM import):

    • Object.defineProperty(exports|this|module.exports, "__esModule", { value: true|!0 })
    • exports|this|module.exports.__esModule = true|!0

當檢測到不可分析的代碼時,webpack會自動退出,而且徹底不跟蹤這些模塊的導出信息(出於性能緣由)。

Optimization per runtime

Webpack 5如今可以(在默認狀況下)分析和優化每一個運行時模塊(一個運行時一般等於一個入口點)。這容許僅在真正須要導出的入口點中導出。入口點不會相互影響(只要每一個入口點使用運行時)

Module Concatenation

模塊鏈接也適用於每一個運行時,以容許對每一個運行時進行不一樣的鏈接。

模塊鏈接已經成爲第一類公民,任何模塊和依賴項如今均可以實現它。最初webpack 5已經增長了對外部模塊和json模塊的支持,很快就會推出更多。

General Tree Shaking improvements

export * 已經改良到跟蹤更多的信息而且再也不標記 default導出使用

export * 當webpack檢測到衝突導出的時候展現警告

import() 容許經由神奇的註釋/* webpackExports: ["abc", "default"] */手動tree shake模塊

Development Production Similarity

咱們試圖經過改進兩種模式之間的類似性,在開發模式下的構建性能和避免僅用於生產的問題之間找到一個好的折衷。

Webpack 5在這兩種模式下都默認啓用了sideEffects優化。在webpack 4中,因爲package.json中不正確的「反作用」標誌,這種優化致使了一些僅用於生產的錯誤。在開發中啓用這種優化能夠更快更容易地找到這些問題。

在許多狀況下,開發和生產發生在不一樣的操做系統上,文件系統的大小寫敏感性也不一樣,因此webpack 5在出現奇怪的大小寫問題時增長了一些警告/錯誤。

Improved Code Generation

如今在輸出中有一些選項。如今的環境。它們容許指定哪一個EcmaScript特性能夠用於webpack生成的運行時代碼。

一般不直接指定該選項,而是使用target選項。

webpack 4過去只發出ES5代碼。webpack 5如今能夠同時生成ES5和ES6/ES2015代碼。

只支持現代瀏覽器將使用箭頭函數生成更短的代碼,使用const聲明生成更多的spec-comform代碼,使用TDZ做爲導出默認值。

Improved target option

在webpack 4中,target 是在「web」和「node」(以及其餘一些)之間作出很是粗糙的選擇。Webpack 5提供了更多的選項。

目標選項如今對生成代碼的影響比之前更多:

  • chunk加載方法
  • chunks格式
  • wasm加載方法
  • chunk方法和wasm加載in workers
  • 全局對象使用
  • 是否應該自動肯定publicPath
  • 通常代碼使用的EcmaScript功能/語法
  • 默認啓用externals
  • 一些nodejs兼容層的行爲 (global, __filename, __dirname)
  • 模塊解析(browser field, exports and imports 條件)
  • 一些加載器可能會基於此改變行爲

webnode之間作出對於這些事情的選擇很是粗糙,咱們須要更多信息.所以,咱們容許指定最小版本,例如「node10.13」,並推斷有關目標環境的更多屬性。
如今容許使用一個數組合並多個target.webpack會決定全部target的最低屬性配置,當使用不提供完整信息的目標(如「web」或「節點」(沒有版本號))時,使用數組也頗有用。例如["web", "es2020"]結合這兩個部分目標。

有一個目標「browserslist」,它將使用browserslist數據來肯定環境的屬性。當項目中有可用的browserslist配置時,默認也會使用此目標。當沒有可用的配置時,「web」目標將被默認使用。

有些組合和特性還沒有實現,將致使錯誤。它們是爲未來的特性作準備。例子:

  • ["web", "node"] 將致使一個通用的塊加載方法,這是還沒有實現
  • ["web", "node"] + output.module: true 將致使模塊塊加載方法,這是還沒有實現
  • "web" 將會致使 http(s): 導入被視爲外部模塊, 這是還沒有實現 (應變方法: externalsPresets: { web: false, webAsync: true }, 這會使用 import() 替代).

SplitChunks and Module Sizes

模塊如今以一種比顯示單個數字更好的方式表示大小。此外,如今有不一樣類型的尺寸。

SplitChunksPlugin如今知道怎麼用minSizemaxSize去處理那些不一樣尺寸,默認只有Javascript尺寸會被處理,不過你能夠用多個值去管理他們

minSize: {
  javascript: 30000,
  style: 50000,
}

遷移:檢查構建中使用的大小類型,並在splitChunks中配置它們。minSizesplitChunks.maxSize可選。

重大變化:性能

Persistent Caching

這是一種文件系統緩存,能夠選擇性的再如下配置使用

cache: {
  // 1. Set cache type to filesystem
  type: "filesystem",
  
  buildDependencies: {
    // 2. Add your config as buildDependency to get cache invalidation on config change
    config: [__filename]
  
    // 3. If you have other things the build depends on you can add them here
    // Note that webpack, loaders and all modules referenced from your config are automatically added
  }
}

重要提示:

默認狀況下,webpack假設只有包管理器修改了webpack所在的node_modules目錄。node_modules跳過了散列和時間戳。相反,出於性能緣由,只使用包名和版本,符號連接(如npm/yarn link)是好的。不要直接編輯node_modules中的文件,除非您選擇不使用snapshot.immutablePaths: []進行此優化。當使用Yarn PnP webpack假設yarn緩存是不可變的(它一般是)。您可使用snapshot.immutablePaths: []選擇退出此優化。

緩存將存儲在node_modules/.cache/webpack(當使用node_modules時)resp. .yarn/.cache/webpack(當使用Yarn PnP時)。你可能永遠都不須要手動刪除它。
許多內部插件也會使用持久緩存。示例:SourceMapDevToolPlugin(緩存生成的SourceMap), ProgressPlugin(緩存大量模塊)
持久緩存將根據使用狀況自動建立多個緩存文件,以優化對緩存的讀寫訪問。

Compiler Idle and Close

Compiler如今須要在使用完以後關閉,Compiler在進入和離開idle的時候有針對它們狀態的鉤子,插件可能用這些鉤子去作不重要的工做(例如, 把持久緩存慢慢地存儲到硬盤). 在Compiler關閉以後 - 全部剩下的工做會被儘量快的完成,一個回調信號表示結束.

插件和它們各自的做者應該預料到一些使用者可能會忘記去關閉Compiler,因此,全部工做最終應該都在idle階段完成.當工做完成的時候應該阻止進程退出.

webpack() 在被傳遞迴調時自動調用 close

遷移:在使用node.js API時,確保調用Compiler.close後關閉。

File Emitting

webpack一般會在第一次構建期間emit全部的輸出文件而在後面的增量構建(監聽)會跳過寫入沒改變的文件,假定webpack運行期間沒有其餘東西改變輸出文件

隨着持久緩存的增長,即便在重啓webpack進程時,也應該提供watch-like的體驗,可是,若是認爲即便在webpack不運行的狀況下,也沒有其餘東西改變輸出目錄,那就太過度了。

因此如今webpack如今會檢測在輸出目錄的現有文件並將它們的內容與內存中的輸出文件進行比較,只有當它們改變的時候纔會寫入文件,這隻會在第一次構建完成,任何增量構建老是在webpack運行進程生成新的資源寫入文件

咱們假定webpack和插件只有在內容發生改變纔會生成新的資源,緩存應該確保當輸入是相等的時候沒有新的資源生成,不聽從這個建議會下降性能

文件被標記immutable(包括內容hash),當已存在相同名字的文件的時候將永遠不會被寫入,咱們假定當文件內容改變的時候內容hash會被改變,這一般是對的,但在webpack或者插件開發階段不老是正確

主要變化:長期懸而未決的問題

Node.js target

在webpack 4中,一些特性是不可用的,例如Node.js目標。其中一些如今已經能夠了。

因爲沒法加載多個初始文件,node.js不能在初始塊中進行SplitChunks。如今是可能的。入口文件如今將加載附加文件和運行時chunk。

SplitChunks for single-file-targets

只容許啓動單個文件的目標(如node、WebWorker、electron main)如今支持由運行時自動加載引導所需的依賴部分。

這容許使用 splitChunks chunks: "all"來處理這些目標」。

注意,因爲塊加載是異步的,這使得初始計算也異步。當使用output.library 會是一個問題,由於導出值如今是一個Promise, 因爲alpha.14這不適用於target: "node", 由於chunk加載是同步

Updated Resolver

enhanced-resolve更新到v5, 有下面提提高:

  • 解析跟蹤更多的依賴關係,如丟失的文件
  • 別名可能有多種選擇
  • 別名爲false如今是可能的
  • 提升性能

Chunks without JS

不包含JS代碼的塊,將再也不生成JS文件。

重大變化:將來

實驗

並非全部的特性都從一開始就是穩定的。在webpack 4中,咱們添加了一些實驗性的特性,並在更新日誌中指出這些特性還處於試驗階段,但從配置中並不老是能清楚地看出這些特性是否還處於試驗階段。

在webpack 5中有一個新的experiments配置選項,它容許啓用實驗特性。這能夠清楚地說明哪些選項是啓用的/使用的。

雖然webpack遵循語義版本控制,但它會對實驗性特性進行例外處理。在小型webpack版本中,實驗性的特性可能包含破壞性的變化。當發生這種狀況時,咱們將在更改日誌中添加一個明確的說明。這將容許咱們更快地迭代實驗特性,同時也容許咱們在主要版本上停留更長的時間以得到穩定的特性。

webpack 5將附帶如下實驗:

  • 舊的WebAssembly支持,如webpack 4 ( experiments.syncWebAssembly)
  • 新的WebAssembly支持根據更新的規範( experiments.asyncWebAssembly)

    • 這使得WebAssembly模塊成爲一個異步模塊
  • Top Level Await 階段3草案 (experiments.topLevelAwait)

    • 在頂層使用 await將使模塊成爲異步模塊
  • Emitting bundle as module (experiments.outputModule)

    • 這將包裝器IIFE從包中刪除,強制採用嚴格模式,經過 <script type="module">延遲加載,並在模塊模式下最小化

注意,這也意味着默認狀況下禁用WebAssembly支持。

最低node.js版本

最小支持的node.js版本從6增長到10.13.0(LTS)。

遷移:升級到可用的最新node.js版本。

對配置的更改

對結構的更改

  • entry: {} allows an empty object now (to allow to use plugins to add entries)
  • target supports an array, versions and browserslist
  • cache: Object removed: Setting to a memory-cache object is no longer possible
  • cache.type added: It's now possible to choose between "memory" and "filesystem"
  • New configuration options for cache.type = "filesystem" added:

    • cache.cacheDirectory
    • cache.name
    • cache.version
    • cache.store
    • cache.hashAlgorithm
    • cache.idleTimeout
    • cache.idleTimeoutForIntialStore
    • cache.buildDependencies
  • snapshot.resolveBuildDependencies added
  • snapshot.resolve added
  • snapshot.module added
  • snapshot.managedPaths added
  • snapshot.immutablePaths added
  • resolve.cache added: Allows to disable/enable the safe resolve cache
  • resolve.concord removed
  • resolve.alias values can be arrays or false now
  • resolve.restrictions added: Allows to restrict potential resolve results
  • resolve.fallback added: Allow to alias requests that failed to resolve
  • resolve.preferRelative added: Allows to resolve modules requests are relative requests too
  • Automatic polyfills for native node.js modules were removed

    • node.Buffer removed
    • node.console removed
    • node.process removed
    • node.* (node.js native module) removed
    • MIGRATION: resolve.alias and ProvidePlugin. Errors will give hints. (Refer to node-libs-browser for polyfills & mocks used in v4)
  • output.filename can now be a function
  • output.assetModuleFilename added
  • output.jsonpScriptType renamed to output.scriptType
  • devtool is more strict
  • Format: false | eval | [inline-|hidden-|eval-][nosources-][cheap-[module-]]source-map
  • optimization.chunkIds: "deterministic" added
  • optimization.moduleIds: "deterministic" added
  • optimization.moduleIds: "hashed" deprecated
  • optimization.moduleIds: "total-size" removed
  • Deprecated flags for module and chunk ids were removed

    • optimization.hashedModuleIds removed
    • optimization.namedChunks removed (NamedChunksPlugin too)
    • optimization.namedModules removed (NamedModulesPlugin too)
    • optimization.occurrenceOrder removed
    • MIGRATION: Use chunkIds and moduleIds
  • optimization.splitChunks test no longer matches chunk name

    • MIGRATION: Use a test function (module, { chunkGraph }) => chunkGraph.getModuleChunks(module).some(chunk => chunk.name === "name")
  • optimization.splitChunks minRemainingSize was added
  • optimization.splitChunks filename can now be a function
  • optimization.splitChunks sizes can now be objects with a size per source type
  • minSize

    • minRemainingSize
    • maxSize
    • maxAsyncSize
    • maxInitialSize
  • optimization.splitChunks maxAsyncSize and maxInitialSize added next to maxSize: allows to specify different max sizes for initial and async chunks
  • optimization.splitChunks name: true removed: Automatic names are no longer supported
  • MIGRATION: Use the default. chunkIds: "named" will give your files useful names for debugging
  • optimization.splitChunks.cacheGroups[].idHint added: Gives a hint how the named chunk id should be chosen
  • optimization.splitChunks automaticNamePrefix removed
  • MIGRATION: Use idHint instead
  • optimization.splitChunks filename is no longer restricted to initial chunks
  • optimization.splitChunks usedExports added to include used exports when comparing modules
  • optimization.splitChunks.defaultSizeTypes added: Specified the size types when using numbers for sizes
  • optimization.mangleExports added
  • optimization.minimizer "..." can be used to reference the defaults
  • optimization.usedExports "global" value added to allow to disable the analysis per runtime and instead do it globally (better performance)
  • optimization.noEmitOnErrors renamed to optimization.emitOnErrors and logic inverted
  • optimization.realContentHash added
  • output.devtoolLineToLine removed
  • MIGRATION: No replacement
  • output.chunkFilename: Function is now allowed
  • output.hotUpdateChunkFilename: Function is now forbidden: It never worked anyway.
  • output.hotUpdateMainFilename: Function is now forbidden: It never worked anyway.
  • output.importFunctionName: string specifies the name used as replacement for import() to allow polyfilling for non-suppored environments
  • output.charset added: setting it to false omit the charset property on script tags
  • output.hotUpdateFunction renamed to output.hotUpdateGlobal
  • output.jsonpFunction renamed to output.chunkLoadingGlobal
  • output.chunkCallbackFunction renamed to output.chunkLoadingGlobal
  • output.chunkLoading added
  • output.enabledChunkLoadingTypes added
  • output.chunkFormat added
  • module.rules resolve and parser will merge in a different way (objects are deeply merged, array may include "..." to reference to prev value)
  • module.rules parser.worker added: Allows to configure the worker supported
  • module.rules query and loaders were removed
  • module.rules options passing a string is deprecated
  • MIGRATION: Pass an options object instead, open an issue on the loader when this is not supported
  • module.rules mimetype added: allows to match a mimetype of a DataUri
  • module.rules descriptionData added: allows to match a data from package.json
  • module.defaultRules "..." can be used to reference the defaults
  • stats.chunkRootModules added: Show root modules for chunks
  • stats.orphanModules added: Show modules which are not emitted
  • stats.runtime added: Show runtime modules
  • stats.chunkRelations added: Show parent/children/sibling chunks
  • stats.errorStack added: Show webpack-internal stack trace of errors
  • stats.preset added: select a preset
  • stats.relatedAssets added: show assets that are related to other assets (e. g. SourceMaps)
  • stats.warningsFilter deprecated in favor of ignoreWarnings
  • BannerPlugin.banner signature changed
  • data.basename removed

    • data.query removed
    • MIGRATION: extract from filename
  • SourceMapDevToolPlugin lineToLine removed
  • MIGRATION: No replacement
  • [hash] as hash for the full compilation is now deprecated
  • MIGRATION: Use [fullhash] instead or better use another hash option
  • [modulehash] is deprecated
  • MIGRATION: Use [hash] instead [moduleid] is deprecated
  • MIGRATION: Use [id] instead [filebase] removed
  • MIGRATION: Use [base] instead
  • New placeholders for file-based templates (i. e. SourceMapDevToolPlugin)

    • [name]
    • [base]
    • [path]
    • [ext]
  • externals when passing a function, it has now a different signature ({ context, request }, callback)
  • MIGRATION: Change signature
  • externalsPresets added
  • experiments added (see Experiments section above)
  • watchOptions.followSymlinks added
  • watchOptions.ignored can now be a RegExp
  • webpack.util.serialization is now exposed.

對默認值的更改

  • target is now "browserslist" by default when a browserslist config is available
  • module.unsafeCache is now only enabled for node_modules by default
  • optimization.moduleIds defaults to deterministic in production mode, instead of size
  • optimization.chunkIds defaults to deterministic in production mode, instead of total-size
  • optimization.nodeEnv defaults to false in none mode
  • optimization.splitChunks.minSize defaults to 20k in production
  • optimization.splitChunks.enforceSizeThreshold defaults to 50k in production
  • optimization.splitChunks minRemainingSize defaults to minSize
  • This will lead to less splitted chunks created in cases where the remaining part would be too small
  • optimization.splitChunks maxAsyncRequests and maxInitialRequests defaults was been increased to 30
  • optimization.splitChunks.cacheGroups.vendors has be renamed to optimization.splitChunks.cacheGroups.defaultVendors
  • optimization.splitChunks.cacheGroups.defaultVendors.reuseExistingChunk now defaults to true
  • resolve(Loader).cache defaults to true when cache is used
  • resolve(Loader).cacheWithContext defaults to false
  • resolveLoader.extensions remove .json
  • node.global node.__filename and node.__dirname defaults to false in node-targets
  • stats.errorStack defaults to false

Loader related Changes

this.getOptions

這個新的API應該簡化加載器中選項的使用。它容許經過一個JSON模式進行驗證。詳情請參見https://github.com/webpack/we...

主要的內部變化

下面的變化只與插件做者相關:

New plugin order

webpack 5中的插件如今在缺省配置被應用以前就已經被應用了。這容許插件應用它們本身的默認值,或者充當配置預置。

但這也是一個破壞性的改變,由於插件在應用時不能依賴於配置值的設置。

遷移:僅在插件掛鉤中訪問配置。或者最好避免訪問配置,並經過構造函數接受選項。

Runtime Modules

大部分運行時代碼被轉移到所謂的「runtime modules」中。這些特殊模塊負責添加運行時代碼.它們能夠添加到任何塊中,但當前老是添加到運行時塊中。「Runtime Requirements」控制將哪些運行時模塊(或核心運行時部分)添加到包中。這確保只有使用的運行時代碼被添加到包中。未來,運行時模塊還能夠添加到按需加載塊中,以便在須要時加載運行時代碼

在大多數狀況下,核心運行時容許內嵌入口模塊,而不是用`__webpack_require__調用它。若是包中沒有其餘模塊,那麼就不須要其餘的__webpack_require__了.這與模塊鏈接很好地結合在一塊兒,即將多個模塊鏈接成單個模塊。

在最好的狀況下,根本不須要運行時代碼。

遷移:若是你將運行時代碼注入到webpack運行時的插件中,能夠考慮使用RuntimeModules。

Serialization

添加了一個序列化機制來容許webpack中複雜對象的序列化,它具備可選擇的語義,所以應該被序列化的類須要顯式地標記(並實現它們的序列化).對於大多數模塊,全部依賴項和一些錯誤已經這樣作了。

遷移:在使用自定義模塊或依賴項時,建議將它們序列化,以便從持久緩存中獲益

Extensible Caching

添加了帶有插件接口的緩存類。這個類可用於對緩存進行讀寫。根據配置的不一樣,不一樣的插件能夠向緩存添加功能。

MemoryCachePlugin 添加內存緩存,FileCachePlugin添加持久(文件系統)緩存

FileCachePlugin使用序列化機制來向/從磁盤中持久化和恢復緩存項

Hook Object Frozen

帶有鉤子的類會凍結它們的鉤子對象,所以再也不可能以這種方式添加自定義鉤子。

遷移:推薦的添加自定義鉤子的方法是使用WeakMap和靜態 getXXXHooks(XXX)(即 getCompilationHook(compile))方法。內部類使用與自定義鉤子相同的機制。

Tapable Upgrade

webpack 3插件的兼容層已經被刪除。它已經被webpack 4棄用了

一些較少使用的tapable api被刪除或棄用。

遷移:使用新的tapable API。

Staged Hooks

在密封過程的幾個步驟中,有多個不一樣階段的掛鉤。即。optimizeDependenciesBasic` `optimizeDependencies` and `optimizeDependenciesAdvanced,這些已經被移除,取而代之的是一個能夠與stage選項一塊兒使用的單一鉤子。有關可能的階段,請參閱 OptimizationStages

遷移:將鉤子掛入剩餘的鉤子。你能夠添加一個 stage選項。

Main/Chunk/ModuleTemplate deprecation

Bundle模板已經被重構。MainTemplate/ChunkTemplate/ModuleTemplate被棄用,JavascriptModulesPlugin如今負責JS模板的處理。

在重構以前,JS的輸出由Main/ChunkTemplate處理,而另外一個輸出(如WASM、CSS)由插件處理。看起來JS是第一類,而另外一個輸出是第二類。重構改變了全部的輸出都由它們的插件處理。

仍然能夠鏈接到模板的某些部分。這些鉤子如今在JavascriptModulesPlugin中,而不是Main/ChunkTemplate中。(是的,插件也能夠有鉤子。我稱它們爲附着的鉤子。)

有一個編譯層,因此Main/Chunk/ModuleTemplate仍然存在,但只委託tap調用到新的鉤子位置。

遷移:遵循棄用消息中的建議。大多指向不一樣位置的鉤子。

Entry point descriptor

若是一個對象做爲入口點被傳遞,它的值多是一個字符串,字符串數組或者一個描述符:

module.exports = {
  entry: {
    catalog: { 
      import: './catalog.js',
    }
  }
};

描述符語法能夠用來向入口點傳遞其餘選項。

Entry point output filename

默認狀況下,從output.filename提取條目塊的輸出文件名。可是你能夠爲一個特定的條目指定一個自定義輸出文件名:

module.exports = {
  entry: {
    about: { import: './about.js', filename: 'pages/[name][ext]' }
  }
};

Entry point dependency

默認狀況下,每一個entry chunk存儲它使用的全部模塊。經過dependOn-option,您能夠從一個entry chunk到另外一個共享模塊:

module.exports = {
  entry: {
    app: { import: './app.js', dependOn: 'react-vendors' },
    'react-vendors': ['react', 'react-dom', 'prop-types']
  }
};

app chunk 將不包含react-vendors擁有的模塊。

Entry point library

入口描述符容許爲每一個入口點傳遞不一樣的library選項。

module.exports = {
  entry: {
    commonjs: {
      import: './lib.js',
      library: {
        type: "commonjs-module"
      }
    },
    amd: {
      import: './lib.js',
      library: {
        type: "amd"
      }
    }
  }
};

Entry point runtime

入口描述符容許爲每一個入口指定runtime, 當指定時,將建立具備此名稱的chunk,其中僅包含該入口的runtime代碼,當多個入口指定相同的runtime,該chunk將爲全部這些入口包含一個公共runtime,這意味着它們能夠一塊兒使用同一個html頁面

module.exports = {
  entry: {
    app: {
      import: './app.js',
      runtime: "app-runtime"
    }
  }
};

Entry point chunk loading

條目描述符容許爲每一個入口指定一個 chunkLoading。這個入口的運行時將使用它來加載塊。

module.exports = {
  entry: {
    app: {
      import: './app.js'
    },
    worker: {
      import: './worker.js',
      chunkLoading: "importScripts"
    }
  }
};

Order and IDs

webpack用於在編譯階段以特定的方式對模塊和塊進行排序,以增量順序分配id。如今狀況已經不同了。order將再也不用於id生成,相反,id生成的徹底控制在插件中。

用來優化模塊和塊順序的鉤子被刪除了。

遷移:在編譯階段不能再依賴模塊和塊的順序。

Arrays to Sets

  • Compilation.modules is now a Set
  • Compilation.chunks is now a Set
  • Chunk.files is now a Set

有一個打印棄用警告的壓縮層。

遷移:使用Set而不是數組方法。

Compilation.fileSystemInfo

這個新類可用於以緩存的方式訪問關於文件系統的信息。目前,它容許請求文件和目錄時間戳。若是可能的話,時間戳的信息從監視器傳輸,不然由文件系統訪問決定。

在將來,請求文件內容哈希將被添加,模塊將可以檢查文件內容的有效性,而不是文件哈希。

遷移:使用file/fileSystemInfo 代替file/contextTimestamps

如今能夠對目錄進行imestamping,這容許對ContextModules進行序列化。

Compiler.modifiedFiles已經添加了(在 Compiler.removedFiles以後),以便更容易地引用更改後的文件。

Filesystems

compiler.inputFileSystemcompiler.outputFileSystem以後。對於全部不被視爲輸入或輸出的fs操做,好比寫入記錄、緩存或分析輸出,有一個新的 compiler.intermediateFileSystem

文件系統如今有了fs接口,而且再也不須要額外的方法,如join或mkdirp。可是若是它們有像join或dirname這樣的方法,就會使用它們。

Hot Module Replacement

HMR runtime已被重構爲Runtime Modules。 HotUpdateChunkTemplate已經合併到 ChunkTemplate中。ChunkTemplates和插件如今也應該處理 HotUpdateChunks

HMR runtime的javascript部分已經從核心中分離出來。其餘模塊類型如今也能夠以本身的方式處理HMR。在將來,這將容許爲像mini-css-extract-plugin或WASM模塊提供。

遷移:因爲這是一個新引入的功能,因此不須要遷移。

import.meta.webpackHotmodule.hot公開相同的API。這也適用於嚴格的ESM模塊(.mjs, type: "module" in package.json)不訪問模塊。

Work Queues

webpack用函數調用函數的方式去處理模塊,以及限制併發的semaphore Compilation.semaphore已經被移除,異步隊列如今處理工做排隊和處理。每一步都有一個單獨的隊列:

  • Compilation.factorizeQueue: 爲一組依賴項調用模塊工廠
  • Compilation.addModuleQueue: 爲一組依賴項調用模塊工廠
  • Compilation.buildQueue: 若有必要,構建模塊(可能將模塊存儲到緩存中)
  • Compilation.rebuildQueue: 若是手動觸發,則再次構建模塊。
  • Compilation.processDependenciesQueue: 處理模塊的依賴關係。

這些隊列有一些鉤子來監視和攔截做業處理。

未來,多個編譯器可能一塊兒工做,而job orchestration能夠經過攔截這些隊列來完成。

遷移:因爲這是一個新引入的功能,因此不須要遷移。

Logging

webpack內部如今包含了一些日誌記錄統計數據。可使用 stats.logging and infrastructureLogging選項來啓用這些消息。

Module and Chunk Graph

webpack用於將解析後的模塊存儲在依賴項中,並將包含的模塊存儲在chunk中。如今狀況已經不同了。全部關於模塊圖中模塊如何鏈接的信息如今都存儲在ModuleGraph類中。全部關於模塊如何與chunk鏈接的信息如今都存儲在ChunkGraph類中。依賴於塊圖的信息也存儲在相關類中。

這意味着如下關於模塊的信息已經被移動

  • Module connections -> ModuleGraph
  • Module issuer -> ModuleGraph
  • Module optimization bailout -> ModuleGraph (TODO: check if it should ChunkGraph instead)
  • Module usedExports -> ModuleGraph
  • Module providedExports -> ModuleGraph
  • Module pre order index -> ModuleGraph
  • Module post order index -> ModuleGraph
  • Module depth -> ModuleGraph
  • Module profile -> ModuleGraph
  • Module id -> ChunkGraph
  • Module hash -> ChunkGraph
  • Module runtime requirements -> ChunkGraph
  • Module is in chunk -> ChunkGraph
  • Module is entry in chunk -> ChunkGraph
  • Module is runtime module in chunk -> ChunkGraph
  • Chunk runtime requirements -> ChunkGraph

webpack過去從緩存中恢復斷開模塊與圖的鏈接這已經沒有必要了。模塊不存儲關於圖形的信息,這能夠在技術上用於多個圖形。這使得緩存更容易。

大多數更改都有一個兼容層,在使用時它會打印一個棄用警告。

遷移:使用ModuleGraph和ChunkGraph上的新api

Init Fragments

DependenciesBlockVariables變量被移除,取而代之的是InitFragments。

DependencyTemplates 如今能夠添加InitFragments 來將代碼注入到模塊源代碼的頂部。InitFragments 容許刪除重複數據。

遷移:使用InitFragments而不是在一個負索引處插入一些東西到源中。

Module Source Types

模塊如今必須經過 Module.getSourceTypes()來定義它們支持的源類型。根據這一點,不一樣的插件使用這些類型調用 source(),也就是說,對於源代碼類型 javascript, JavascriptModulesPlugin將源代碼嵌入到包中。源類型 webassembly將使 WebAssemblyModulesPlugin發出一個wasm文件。還支持自定義源類型.也就是說,迷你css-extract-plugin可能會使用源代碼類型樣式表將源代碼嵌入到css文件中。

模塊類型和源類型之間沒有關係。即模塊類型 json也使用源類型 javascript和模塊類型 webassembly/experimental使用源類型 javascriptwebassembly

遷移:自定義模塊須要實現這些新的接口方法。

Extensible Stats

如今的Stats preset, default, json and toString都是經過插件系統來實現的。將當前狀態轉換爲插件。

遷移:您如今能夠自定義它,而不是替換整個Stats功能。如今能夠將額外的信息添加到stats json中,而不是編寫單獨的文件。

New Watching

webpack使用的觀察者被重構了。它之前使用 chokidar和本機依賴 fsevents(僅在OSX上)。如今它只基於本地node.js fs。這意味着webpack中沒有原生依賴關係。

它還在監視時捕獲關於文件系統的更多信息。它如今能夠捕捉時光網時間,查看事件時間,以及丟失文件的信息。爲此,WatchFileSystem API作了一點改動。在它上面,咱們還將數組轉換爲集合,將對象轉換爲映射。

SizeOnlySource after emit

webpack如今替換了Compilation.assets的源代碼。使用 SizeOnlySource變量來減小內存使用的資源。

Emitting assets multiple times

Multiple assets emit different content to the same filename會警告錯誤

ExportsInfo

關於模塊導出信息的存儲方式已被重構。ModuleGraph如今爲每一個模塊提供了一個ExportsInfo,它存儲每一個導出的信息/它還存儲關於未知導出的信息,以及模塊是否僅以反作用的方式使用。

對於每一個導出,存儲如下信息:

  • 是否使用導出? yes, no, not statically known, not determined (參考optimization.usedExports)
  • 是否提供導出? yes, no, not statically known, not determined (參考optimization.providedExports)
  • 能夠將導出名稱重命名嗎? yes, no, not determined.
  • 若是導出已重命名,則使用新名稱 (參考optimization.mangleExports)
  • 嵌套的導出信息,若是導出是一個自己附加了信息的對象

    • 用於從新導出名稱空間對象import * as X from "..."; export { X };
    • 用於表示JSON模塊中的結構

Code Generation Phase

如今,編譯將代碼生成做爲單獨的編譯階段。它再也不隱藏在 Module.source() or Module.getRuntimeRequirements()裏面

這將使流程更乾淨。它還容許報告此階段的進展,並在分析時使代碼生成更加可見。

遷移: Module.source() and Module.getRuntimeRequirements()被廢棄,使用Module.codeGeneration()替代

Improved Code Generation

當ASI發生時,webpack會檢測到,並在沒有插入分號時生成更短的代碼.Object(...) -> (0, ...)

webpack將多個導出getter合併到一個運行時函數調用中:

r.d(x, "a", () => a); r.d(x, "b", () => b); -> r.d(x, {a: () => a, b: () => b});

DependencyReference

webpack過去有一個方法和類型來表示依賴項的引用(Compilation.getDependencyReference returning a DependencyReference). 此類型用於包括關於此引用的全部信息,如已導入導出的被引用模塊,若是它是弱引用,還包括一些排序相關信息。

將全部這些信息捆綁在一塊兒使得獲取參考變得昂貴,並且每次人們須要一條信息時,它也常常被調用。

在webpack 5中,這部分代碼基被重構,方法被分解。

  • 能夠從ModuleGraphConnection中讀取所引用的模塊
  • 導入導出名稱能夠經過Dependency.getReferencedExports()得到。
  • Dependency類上有一個weak標誌
  • 排序只與 HarmonyImportDependencies相關,能夠經過 sourceOrder屬性得到

Presentational Dependencies

如今在 NormalModules中有一種新的依賴類型:表示依賴

這些依賴關係只在代碼生成階段使用,而在模塊圖構建階段不使用。所以它們永遠不會有引用的模塊或影響導出/導入。

處理這些依賴關係的成本更低,webpack儘量使用它們

Deprecated loaders

  • null-loader

    它將被廢棄。使用

    alias: {
        xyz$: false
    }

    或者使用絕對路徑 [path.resolve(__dirname, "....")]: false

Minor Changes

  • Compiler.name: 當生成帶有絕對路徑的編譯器名稱時,請確保使用|或!名字的兩個部分。

    • 如今廢棄使用空格做爲分隔符。(路徑能夠包含空間)
    • 提示:在Stats字符串輸出中,|被替換爲空格。
  • SystemPlugin 默認被禁用

    • 遷移:避免使用它,由於規範已經被刪除。您可使用Rule.parser.system: true
  • ModuleConcatenationPlugin: 因爲DependencyVariables已經被刪除,因此鏈接再也不被阻止

    • 這意味着它如今能夠在 module, global, process或ProvidePlugin的狀況下鏈接
  • exec從加載器上下文中刪除

    • 遷移:這能夠在加載器自己中實現
  • Stats.presetToOptions 移除

    • 遷移: 使用compilation.createStatsOptions替代
  • SingleEntryPlugin andSingleEntryDependency移除

    • 遷移: 使用 EntryPlugin and EntryDependency
  • chunk如今能夠有多個入口模塊
  • ExtendedAPIPlugin 移除

    • 遷移: 再也不須要,剩下的webpack_hash__webpack_chunkname__能夠一直使用,運行時代碼被注入到須要的地方。
  • ProgressPlugin 再也不爲reportProgress使用tapable context

    • 遷移: 使用ProgressPlugin.getReporter(compiler)替代
  • ProvidePlugin再次爲.mjs文件啓用
  • Stats json errors and warnings再也不包含字符串,而是包含信息分解爲屬性的對象。

    • 遷移:訪問有關屬性的信息。即message
  • Compilation.hooks.normalModuleLoader廢棄

    • 遷移: 使用 NormalModule.getCompilationHooks(compilation).loader替代
  • NormalModuleFactory鉤子已經從瀑布模型改爲流水模型, 改變和重命名返回瀑布函數的鉤子
  • 移除compilationParams.compilationDependencies

    • 經過添加compilation.file/context/missingDependencies插件能夠將依賴項添加到編譯中
    • 兼容層將委託編compilationDependencies.addfileDependencies.add
  • stats.assetsByChunkName[x]如今是數組
  • __webpack_get_script_filename__函數添加爲了得到script文件名
  • getResolve(options) 會在加載器API用不一樣的方式合併選項參數,參考module.rules resolve
  • package.json的sideEffects會被glob-to-regex處理取代micromatch

    • 這可能改變了邊界狀況下的語義
  • checkContextIgnorePlugin移除
  • 新的__webpack_exports_info__ API容許導出usage introspection
  • SourceMapDevToolPlugin如今也適用於non-chunk assets
  • 當引用的env變量丟失且沒有回退時,EnvironmentPlugin如今會顯示錯誤
  • 從架構中刪除服務屬性

Other Minor Changes

  • removed buildin directory and replaced buildins with runtime modules
  • Removed deprecated features

    • BannerPlugin now only support one argument that can be an object, string or function
  • removed CachePlugin
  • Chunk.entryModule is deprecated, use ChunkGraph instead
  • Chunk.hasEntryModule is deprecated
  • Chunk.addModule is deprecated
  • Chunk.removeModule is deprecated
  • Chunk.getNumberOfModules is deprecated
  • Chunk.modulesIterable is deprecated
  • Chunk.compareTo is deprecated
  • Chunk.containsModule is deprecated
  • Chunk.getModules is deprecated
  • Chunk.remove is deprecated
  • Chunk.moveModule is deprecated
  • Chunk.integrate is deprecated
  • Chunk.canBeIntegrated is deprecated
  • Chunk.isEmpty is deprecated
  • Chunk.modulesSize is deprecated
  • Chunk.size is deprecated
  • Chunk.integratedSize is deprecated
  • Chunk.getChunkModuleMaps is deprecated
  • Chunk.hasModuleInGraph is deprecated
  • Chunk.updateHash signature changed
  • Chunk.getChildIdsByOrders signature changed (TODO: consider moving to ChunkGraph)
  • Chunk.getChildIdsByOrdersMap signature changed (TODO: consider moving to ChunkGraph)
  • Chunk.getChunkModuleMaps removed
  • Chunk.setModules removed
  • deprecated Chunk methods removed
  • ChunkGraph added
  • ChunkGroup.setParents removed
  • ChunkGroup.containsModule removed
  • ChunkGroup.remove no longer disconnected the group from block
  • ChunkGroup.compareTo signature changed
  • ChunkGroup.getChildrenByOrders signature changed
  • ChunkGroupindex and index renamed to pre/post order index

    • old getter is deprecated
  • ChunkTemplate.hooks.modules signature changed
  • ChunkTemplate.hooks.render signature changed
  • ChunkTemplate.updateHashForChunk signature changed
  • Compilation.hooks.optimizeChunkOrder removed
  • Compilation.hooks.optimizeModuleOrder removed
  • Compilation.hooks.advancedOptimizeModuleOrder removed
  • Compilation.hooks.optimizeDependenciesBasic removed
  • Compilation.hooks.optimizeDependenciesAdvanced removed
  • Compilation.hooks.optimizeModulesBasic removed
  • Compilation.hooks.optimizeModulesAdvanced removed
  • Compilation.hooks.optimizeChunksBasic removed
  • Compilation.hooks.optimizeChunksAdvanced removed
  • Compilation.hooks.optimizeChunkModulesBasic removed
  • Compilation.hooks.optimizeChunkModulesAdvanced removed
  • Compilation.hooks.optimizeExtractedChunksBasic removed
  • Compilation.hooks.optimizeExtractedChunks removed
  • Compilation.hooks.optimizeExtractedChunksAdvanced removed
  • Compilation.hooks.afterOptimizeExtractedChunks removed
  • Compilation.hooks.stillValidModule added
  • Compilation.hooks.statsPreset added
  • Compilation.hooks.statsNormalize added
  • Compilation.hooks.statsFactory added
  • Compilation.hooks.statsPrinter added
  • Compilation.fileDependencies, Compilation.contextDependencies and Compilation.missingDependencies are now LazySets
  • Compilation.entries removed
  • MIGRATION: Use Compilation.entryDependencies instead
  • Compilation._preparedEntrypoints removed
  • dependencyTemplates is now a DependencyTemplates class instead of a raw Map
  • Compilation.fileTimestamps and contextTimestamps removed
  • MIGRATION: Use Compilation.fileSystemInfo instead
  • Compilation.waitForBuildingFinished removed
  • MIGRATION: Use the new queues
  • Compilation.addModuleDependencies removed
  • Compilation.prefetch removed
  • Compilation.hooks.beforeHash is now called after the hashes of modules are created
  • MIGRATION: Use Compiliation.hooks.beforeModuleHash instead
  • Compilation.applyModuleIds removed
  • Compilation.applyChunkIds removed
  • Compiler.root added, which points to the root compiler
  • it can be used to cache data in WeakMaps instead of statically scoped
  • Compiler.hooks.afterDone added
  • Source.emitted is no longer set by the Compiler
  • MIGRATION: Check Compilation.emittedAssets instead
  • Compiler/Compilation.compilerPath added: It's a unique name of the compiler in the compiler tree. (Unique to the root compiler scope)
  • Module.needRebuild deprecated
  • MIGRATION: use Module.needBuild instead
  • Dependency.getReference signature changed
  • Dependency.getExports signature changed
  • Dependency.getWarnings signature changed
  • Dependency.getErrors signature changed
  • Dependency.updateHash signature changed
  • Dependency.module removed
  • There is now a base class for DependencyTemplate
  • MultiEntryDependency removed
  • EntryDependency added
  • EntryModuleNotFoundError removed
  • SingleEntryPlugin removed
  • EntryPlugin added
  • Generator.getTypes added
  • Generator.getSize added
  • Generator.generate signature changed
  • HotModuleReplacementPlugin.getParserHooks added
  • Parser was moved to JavascriptParser
  • ParserHelpers was moved to JavascriptParserHelpers
  • MainTemplate.hooks.moduleObj removed
  • MainTemplate.hooks.currentHash removed
  • MainTemplate.hooks.addModule removed
  • MainTemplate.hooks.requireEnsure removed
  • MainTemplate.hooks.globalHashPaths removed
  • MainTemplate.hooks.globalHash removed
  • MainTemplate.hooks.hotBootstrap removed
  • MainTemplate.hooks some signatures changed
  • Module.hash deprecated
  • Module.renderedHash deprecated
  • Module.reasons removed
  • Module.id deprecated
  • Module.index deprecated
  • Module.index2 deprecated
  • Module.depth deprecated
  • Module.issuer deprecated
  • Module.profile removed
  • Module.prefetched removed
  • Module.built removed
  • Module.used removed
  • MIGRATION: Use Module.getUsedExports instead
  • Module.usedExports deprecated

    • MIGRATION: Use Module.getUsedExports instead
  • Module.optimizationBailout deprecated
  • Module.exportsArgument removed
  • Module.optional deprecated
  • Module.disconnect removed
  • Module.unseal removed
  • Module.setChunks removed
  • Module.addChunk deprecated
  • Module.removeChunk deprecated
  • Module.isInChunk deprecated
  • Module.isEntryModule deprecated
  • Module.getChunks deprecated
  • Module.getNumberOfChunks deprecated
  • Module.chunksIterable deprecated
  • Module.hasEqualsChunks removed
  • Module.useSourceMap moved to NormalModule
  • Module.addReason removed
  • Module.removeReason removed
  • Module.rewriteChunkInReasons removed
  • Module.isUsed removed
  • MIGRATION: Use isModuleUsed, isExportUsed and getUsedName instead
  • Module.updateHash signature changed
  • Module.sortItems removed
  • Module.unbuild removed
  • MIGRATION: Use invalidateBuild instead
  • Module.getSourceTypes added
  • Module.getRuntimeRequirements added
  • Module.size signature changed
  • ModuleFilenameHelpers.createFilename signature changed
  • ModuleProfile class added with more data
  • ModuleReason removed
  • ModuleTemplate.hooks signatures changed
  • ModuleTemplate.render signature changed
  • Compiler.dependencies removed
  • MIGRATION: Use MultiCompiler.setDependencies instead
  • MultiModule removed
  • MultiModuleFactory removed
  • NormalModuleFactory.fileDependencies, NormalModuleFactory.contextDependencies and NormalModuleFactory.missingDependencies are now LazySets
  • RuntimeTemplate methods now take runtimeRequirements arguments
  • serve property is removed
  • Stats.jsonToString removed
  • Stats.filterWarnings removed
  • Stats.getChildOptions removed
  • Stats helper methods removed
  • Stats.toJson signature changed (second argument removed)
  • ExternalModule.external removed
  • HarmonyInitDependency removed
  • Dependency.getInitFragments deprecated
  • MIGRATION: Use apply initFragements instead
  • DependencyReference now takes a function to a module instead of a Module
  • HarmonyImportSpecifierDependency.redirectedId removed

    • MIGRATION: Use setId instead
  • acorn 5 -> 7
  • Testing

    • HotTestCases now runs for multiple targets async-node node web webworker
    • TestCases now also runs for filesystem caching with store: "instant" and store: "pack"
    • TestCases now also runs for deterministic module ids
  • Tooling added to order the imports (checked in CI)
  • Chunk name mapping in runtime no longer contains entries when chunk name equals chunk id
  • add resolvedModuleId resolvedModuleIdentifier and resolvedModule to reasons in Stats which point to the module before optimizations like scope hoisting
  • show resolvedModule in Stats toString output
  • loader-runner was upgraded: https://github.com/webpack/lo...
  • file/context/missingDependencies in Compilation are no longer sorted for performance reasons
  • Do not rely on the order
  • webpack-sources was upgraded: https://github.com/webpack/we...
  • webpack-command support was removed
  • Use schema-utils@2 for schema validation
  • Compiler.assetEmitted has an improved second argument with more information
  • BannerPlugin omits trailing whitespace
  • removed minChunkSize option from LimitChunkCountPlugin
  • reorganize from javascript related files into sub-directory

    • webpack.JavascriptModulesPlugin -> webpack.javascript.JavascriptModulesPlugin
  • Logger.getChildLogger added
  • change the default of entryOnly of the DllPlugin to true
  • remove special request shortening logic and use single relative paths for readable module names
  • allow webpack:// urls in SourceMaps to provided paths relative to webpack root context
  • add API to generate and process CLI arguments targeting webpack configuration
  • add __system_context__ as context from System.js when using System.js as libraryTarget
  • add bigint support for the DefinePlugin
  • add bigint support for basic evaluations like maths
  • remove ability to modify the compilation hash after the hash has been created
  • remove HotModuleReplacementPlugin multiStep mode
  • assetInfo from emitAsset will now merge when nested objects or arrays are used
  • [query] is now a valid placeholder when for paths based on a filename like assets
  • add Compilation.deleteAsset to correctly delete an assets and non-shared related assets
  • expose require("webpack-sources") as require("webpack").sources
  • terser 5
相關文章
相關標籤/搜索