webpack 4.0.0 release notes

摘要：重大改变环境不再支持。它们允许在使用动态表达式时过滤文件。可以使用它来创建相对于应用程序根目录的东西启用时，将标志添加到上下文已替换为图已更改之前以父子关系相关联。现在以父子关系相关联。

环境（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原文