摘要：重大改變環境不再支持。它們允許在使用動態表達式時過濾文件。可以使用它來創建相對于應用程序根目錄的東西啟用時，將標志添加到上下文已替換為圖已更改之前以父子關系相關聯。現在以父子關系相關聯。

環境（Environment）

不再支持Node.js 4。源碼更新到更高的ecmascript環境版本。

使用（Usage）

您現在必須在兩種模式之間選擇（使用mode 或--mode）：production 或 development

production 模式使用了各種默認的優化配置去生成已經被優化的包

development 支持 comments 和 hint，并啟用devtool 的 eval

production 不支持watching，development 針對快速增量重建進行了優化

production 還可以實現模塊連接（范圍提升 Scope Hoisting）

您也可以使用optimization.* 來做詳細配置（構建您的自定義模式）

process.env.NODE_ENV 被自動設置為 production 或 development（僅在構建的代碼中，而不在配置中）

有一個隱藏的無模式（--mode none）可以禁用所有內容

語法（Syntax）

import() 始終返回命名空間對象。 CommonJS模塊包含在默認導出中

如果您曾經使用import() 導入CommonJs，這可能會破壞您的代碼

配置（Configuration）

您不再需要使用這些插件

NoEmitOnErrorsPlugin -> optimization.noEmitOnErrors（默認情況下在生產模式下打開）

ModuleConcatenationPlugin -> optimization.concatenateModules（默認情況下在生產模式下啟用）

NamedModulesPlugin - > optimization.namedModules（默認情況下在開發模式下啟用）

CommonsChunkPlugin 被移除 -> optimization.splitChunks，optimization.runtimeChunk

JSON

webpack現在可以本地處理JSON

在將JSON通過loader轉換為JS時，您可能需要添加 type: "javascript / auto"

不使用loader 的情況下使用JSON 仍然有用

允許通過ESM語法導入JSON

通過 export 消除JSON模塊是沒用的（unused exports elimination for JSON modules）

優化（Optimization）

升級 uglifyjs-webpack-plugin 到 v1

ES15 支持

模塊（Modules）

webpack 現在支持一下幾種模塊類型:

javascript/auto: ( webpack 3中的默認值）啟用了所有模塊系統的Javascript模塊：CommonJS，AMD，ESM

javascript/esm: EcmaScript模塊，所有其他模塊系統都不可用

javascript/dynamic：只有CommonJS和EcmaScript模塊不可用

json: JSON數據，可通過require和import獲得

webassembly/experimental：WebAssembly模塊（目前是實驗性的）

與javascript/auto 相比，javascript/esm 更嚴格地處理ESM：

導入的模塊需要存在導入名稱

動態模塊（non-esm，即CommonJs）只能通過默認導入來導入，其他一切（包括 namespace import）都會發出錯誤

在.mjs 模塊中默認為javascript/esm

WebAssembly 模塊

可以導入其他模塊（JS和WASM）

通過ESM導入驗證WebAssembly模塊的導出

嘗試從WASM導入不存在的導出時，您將收到警告/錯誤

只能在異步塊中使用。 它們在初始塊中不起作用（對Web性能不利）

通過import() 使用WASM導入模塊

這是一個實驗性特征和變化主題

優化（Optimization）

sideEffects: false 在package.json 中被支持

sideEffects 在package.json中還支持glob表達式和glob表達式數組

使用JSONP數組而不是JSONP函數 -> 異步腳本標記支持，順序不再重要

引入了新的optimization.splitChunks 選項, 詳情: https://gist.github.com/sokra...

現在通過webpack 本身刪除了無用分支

之前：通過Uglify 刪除了無用代碼

現在：通過webpack刪除無用代碼（在某些情況下）

這可以防止在無用分支中發生import() 時崩潰

語法（Syntax）

import() 的magic comment支持webpackInclude 和webpackExclude。 它們允許在使用動態表達式時過濾文件。

使用System.import() 現在會發出警告

您可以設置Rule.parser.system: true 來禁用警告

您可以設置Rule.parser.system: false 來禁用System.import

配置（Configuration）

現在可以使用module.rules[].resolve 配置解析。它可以與全局配置合并

optimization.minimize 中已添加on/off 開關以切換最小化

optimization.minimize 中已添加minimizers 和options 配置

使用（Usage）

驗證了一些插件選項

CLI已移至webpack-cli，您需要安裝webpack-cli 才能使用CLI

ProgressPlugin（--progress）現在顯示插件名稱

至少對于遷移到新插件系統的插件是可以的

性能（Performance）

UglifyJs 現在默認緩存（caches）和并行化（parallizes）

多項性能改進，尤其適用于更快的增量重建

RemoveParentModulesPlugin的性能改進

統計

統計信息可以顯示嵌套在連接模塊中的模塊

配置（Configuration）

為mjs，json和wasm擴展自動選擇模塊類型。 其他擴展需要通過module.rules[].type 來配置

不正確的options.dependencies 配置將拋出錯誤

sideEffects 可以通過module.rules覆蓋

output.hashFunction 可以是自定義散列函數的構造函數

出于性能原因，您可以提供非加密哈希函數

添加output.globalObject 配置選項以允許在運行時exitCode 中選擇全局對象引用

運行時（Runtime）

塊（chunk）加載的錯誤現在包括更多信息和兩個新屬性類型（type）和請求（request）。

Devtool

從SourceMaps和eval中移除comment footer

在eval source map devtool plugin中添加include test 和exclude 支持

性能（Performance）

webpacks AST可以直接從loader傳遞給webpack，以避免額外的解析

未使用的模塊不再做不必要的串聯

添加一個ProfilingPlugin，用于編寫（Chrome）包含插件時序的配置文件

使用for of 而不是forEach

使用Map 和 Set 來代替Objects

使用includes 來代替indexOf

用字符串方法替換了一些RegExp

隊列中不會重復進入相同的任務

默認情況下，使用更快的md4哈希進行散列

優化（Optimization）

當使用超過25個導出時，損壞的導出名稱會更短。

腳本標簽不再是text/javascript和async，因為這是默認值（節省幾個字節）

連接模塊現在產生的代碼更少

常量替換現在不需要__webpack_require__ 且省略了參數

默認（Defaults）

webpack 默認按此順序查找.wasm，.mjs，.js和.json 擴展名

output.pathinfo 現在默認在development 模式下開啟

in-memory 緩存在production 中默認關閉

entry 默認指向路徑 ./src

在省略mode 選項時默認使用production 模式

使用（Usage）

向SourceMapDevToolPlugin 添加詳細的進度報告

刪除插件時提供有用的錯誤消息

統計（stats）

在統計中大小的顯示使用kiB 代替kB

入口點（entrypoints）默認顯示在統計信息中

chunks 在統計中顯示<{parents}> >{children}< 和 ={siblings}=

添加buildAt 時間到統計中

統計json 文件包含輸出路徑

語法（Syntax）

上下文（context）中支持資源查詢

在import() 中引用入口點（entry point）名稱現在會發出錯誤而不是警告

升級到acorn 5 并支持ES 2018

插件（Plugins）

done 現在是異步鉤子

生成的注釋不在*/ 中中斷

webpack不再修改傳遞的選項對象（options object）

Compiler "watch-run" hook 現在作為 Compiler 的第一個參數

將output.chunkCallbackName 添加到schema 以允許配置Web Worker 模板

使用module.id/loaded 正確地避免了模塊鏈接（Module Concatentation）（Scope Hoisting）

OccurenceOrderPlugin 現在按正確的順序對模塊進行排序（而不是顛倒）

調用Watching.invalidate時，會從觀察者讀取文件的時間戳

修正不正確的-！ 在post loaders中

添加run 和watchRun hooks for MultiCompiler

在ESM 中this 顯示undefined

VariableDeclaration 被正確識別為var，const或let

當使用模塊類型為javascript/dynamic 或javascript/module 時，Parser現在使用正確的資源類型（module/script）解析源代碼。

不在當buildMeta 為null的缺失模塊時崩潰

為electron targets 添加original-fs 模塊

HMRPlugin 可以在plugins 之外添加到Compiler 中

使用tap 調用替換了plugin 調用（新的插件系統）

將許多已棄用的插件遷移到新的插件系統API

為json模塊添加了buildMeta.exportsType: "default"

從Parser 中刪除無用的方法（parserStringArray，parserCalculatedStringArray）

移除清除BasicEvaluatedExpression 和多種類型的功能

使用Buffer.from 代替 new Buffer

避免使用forEach，使用for of 代替

使用neo-async 代替async

更新tapable 和enhanced-resolve 依賴關系到新的主要版本

使用prettier

移除 module.loaders

移除 loaderContext.options

移除 Compilation.notCacheable flag

移除 NoErrorsPlugin

移除 Dependency.isEqualResource

移除 NewWatchingPlugin

移除 CommonsChunkPlugin

全新的插件系統

plugin 方法向后兼容

插件中現在應該使用Compiler.hooks.xxx.tap（，fn）

新的主要版本 - enhanced-resolve

Templates for chunks 現在可以生成多個資源（multiple assets）

Chunk.chunks/parents/blocks 不再是Arrays。 內部使用Set，有方法可以訪問它

Parser.scope.renames 和 Parser.scope.definitions 不在使用 Objects/Arrays, 而是 Map/Sets

Parser 使用 StackedSetMap (類似LevelDB的數據結構) 代替 Arrays

應用插件時不再設置Compiler.options

由于重構，Harmony Dependencies已經改變

Dependency.getReference() 現在可能返回一個weak 屬性。Dependency.weak 現在由Dependency 基類使用，并在getReference() 的基本impl中返回

所有Module 的構造函數參數都已更改

將選項合并到ContextModule 和resolveDependencies的options對象中

更改并重命名import() 的依賴項

將Compiler.resolvers 移動到可通過插件訪問的Compiler.resolverFactory 中

Dependency.isEqualResource 已替換為Dependency.getResourceIdentifier

Template 中的方法是靜態的

添加了一個新的RuntimeTemplate 類，并將outputOptions 和requestShortener 移動到此類

許多方法已更新為使用RuntimeTemplate

我們計劃將訪問運行時的代碼移動到這個新類

Module.meta 以及被替代為 Module.buildMeta

已添加Module.buildInfo 和Module.factoryMeta

Module 的某些屬性已移至新對象中

添加了指向context 選項的loaderContext.rootContext。 Loaders 可以使用它來創建相對于應用程序根目錄的東西

啟用HMR時，將this.hot標志添加到loader 上下文

buildMeta.harmony 已替換為buildMeta.exportsType: "namespace"

chunk 圖已更改：

之前：Chunks 以父子關系相關聯。

現在：ChunkGroups 以父子關系相關聯。 ChunkGroups 按順序包含Chunks

之前：AsyncDependenciesBlocks 按順序引用Chunks 的列表

現在：AsyncDependenciesBlocks 引用單個 ChunkGroup

file/contextTimestamps 現在是Maps

map/foreach Chunks/Modules/Parents 方法已經被 廢棄/移除

NormalModule 接受Constructor中的選項對象（options object）

為NormalModule 添加了必需的生成器參數

為NormalModuleFactory 添加了createGenerator 和generator hooks 以自定義代碼生成

允許通過鉤子自定義Chunks 的渲染清單

webpack 4.0.0 release notes github原文