webpack5新特性中文翻译

前言

都是我从官方文档里拼自己理解翻译过来的,借助翻译工具应该大概解析出来,但是能力强的还是建议直接查看文档,毕竟我也不强,怕误导意思

changelog-v5

大方向

这一发布集中在以下方面:

我们尝试通过持久缓存来提高构建性能。
我们尝试用更好的算法和默认值来改进长期缓存。
我们试图通过更好地Tree Shaking和生成代码来改进bundle(捆绑包)的大小。
我们试图改进对web平台的兼容性。
在实现v4中的特性而不引入任何破坏性更改的同时，我们试图清理处于奇怪状态的内部结构。
我们试图通过现在引入破坏性的更改来为将来的特性做准备，让我们尽可能长时间地停留在v5上。

迁移指南

=> see here for a migration guide <=

重大变化:删除

移除已弃用的功能

所有在v4中被废弃的功能都被移除。

迁移: 确保你的webpack4项目没有打印弃用警告

这也有一些被废弃但是在v4中没有打印警告的东西

IgnorePlugin 和 BannerPlugin 现在只能通过一个参数传递,它可以是一个对象,字符串或者函数

废弃代码

新的废弃包括一个依赖代码以便于他们更容易被引用

废弃语法

require.include已经被废弃,当使用的时候会默认发出警告

可以使用Rule.parser.requireInclude去改变行为: 允许, 废弃或者禁止

移除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.webpackHot 是 module.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中的 exports和import字段现在支持。

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切换.
现在的统计数据可以区分 files 和auxiliaryFiles .
默认隐藏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 条件)
一些加载器可能会基于此改变行为

在web和node之间做出对于这些事情的选择非常粗糙,我们需要更多信息.因此，我们允许指定最小版本，例如“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现在知道怎么用minSize和maxSize去处理那些不同尺寸,默认只有Javascript尺寸会被处理,不过你可以用多个值去管理他们

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

迁移:检查构建中使用的大小类型，并在splitChunks中配置它们。minSize和splitChunks.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.inputFileSystem和compiler.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.webpackHot与 module.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使用源类型 javascript和webassembly。

迁移:自定义模块需要实现这些新的接口方法。

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.add到 fileDependencies.add
stats.assetsByChunkName[x]现在是数组
__webpack_get_script_filename__函数添加为了获得script文件名
getResolve(options) 会在加载器API用不同的方式合并选项参数,参考module.rules resolve
package.json的sideEffects会被glob-to-regex处理取代micromatch
- 这可能改变了边界情况下的语义
checkContext从IgnorePlugin移除
新的__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

webpack5新特性中文翻译

前言

大方向

迁移指南

重大变化:删除

移除已弃用的功能

废弃代码

废弃语法

移除Nodejs自动引入Polifills

主要变化:长期缓存

Deterministic Chunk, Module IDs and Export names

Real Content Hash

主要变化:开发支持

Named Chunk IDs

Module Federation

主要变化:新的网络平台功能

JSON模块

Asset模块

import.meta

原生Worker支持

Uris

异步模块

Externals

主要变化:新的Node.js生态系统特性

Resolving

主要变化:开发经验

Improved target

Stats

Progress

Automatic unique naming

Automatic public path

Typescript typings

重大变化:优化

Nested tree-shaking

Inner-module tree-shaking

CommonJs Tree Shaking

Optimization per runtime

Module Concatenation

General Tree Shaking improvements

Development Production Similarity

Improved Code Generation

Improved target option

SplitChunks and Module Sizes

重大变化:性能

Persistent Caching

Compiler Idle and Close

File Emitting

主要变化:长期悬而未决的问题

Node.js target

SplitChunks for single-file-targets

Updated Resolver

Chunks without JS

重大变化:未来

实验

最低node.js版本

对配置的更改

对结构的更改

对默认值的更改

Loader related Changes

this.getOptions

主要的内部变化

New plugin order

Runtime Modules

Serialization

Extensible Caching

Hook Object Frozen

Tapable Upgrade

Staged Hooks

Main/Chunk/ModuleTemplate deprecation

Entry point descriptor

Entry point output filename

Entry point dependency

Entry point library

Entry point runtime

Entry point chunk loading

Order and IDs

Arrays to Sets

Compilation.fileSystemInfo

Filesystems

Hot Module Replacement

Improved `target` option

`this.getOptions`