🚀webpack 4 beta — try it today!🚀

2018-02-27  本文已影响0人  带马界的神秘人

原文

🎁一个承诺的实现 —可预测的发布周期

当我们完成webpack3的发布版时,我们对社区承诺下一个主版本将会提供很长的开发周期。

我们实现了这个承诺【并将持续交付】通过为您带来一大套功能,改进和错误修复,现在就开始使用吧。

🤷‍如何安装 [v4.0.0-beta.0]

如果你用的yarn

yarn add webpack@next webpack-cli --dev

或者npm:

npm install webpack@next webpack-cli --save-dev

🛠如何迁移?

在测试webpack4的时候,越多的人报告plugin 和loader的错误,我们就可以更好的构建一个迁移指南。

所以我们需要你查看更新文档迁徙指南并提供错误反馈! 这有助于我们的文档组创建官方稳定迁移指南。

webpack 4有什么新东西?

下面是一些你会更关注的显著功能。如果想了解更详细的变更,功能和api改动, 请查看变更日志!!!

🚀性能

在多个场景下webpack4性能有着显著的提升,下面是一些主要的性能提升。

ps:我们并没有实现完全的缓存和并行(webpack 5 将会实现)

🔥零配置 — #0CJS

直到今天之前,webpack都需要你明确的指定入口文件和输出文件。webpack4会默认使用./src最为输入目录,./dist作为输出目录。

这意味着你不需要任何配置就可以使用webpack!!!

webpack 4.0.0-beta.0 无配置文件运行! #0CJS 🔥

现在webpack是一个零配置的打包工具,我们将会4.0-5.0提供更多的默认功能。

💪更好的默认配置— mode

你必须选择"production"模式或者"development"模式,通过mode指定。

production模式将会为您提供各种优化。包括压缩,作用域提升,无用代码修剪,无副作用模块修剪,同时包括各种插件例如NoEmitOnErrorsPlugin。

Development模式优化了速度和开发体验。以同样的方式,我们会在打包好的文件中包含被打包文件的路径,用于阅读的代码和快速构建!

🍰sideEffects — 更好的包体积

我们对package.json中的sideEffects:false提供了支持。当这个字段被加到package.json中时,证明这个库没有副作用,意味着webpack可以安全的修剪无用代码。

例如,导入了lodash-es的一个方法,包体积会增加223kib[压缩后],***webpack4***打包后只会增加3Kib!!!

打包配置的影响
我们以前把sideEffets叫做pure-module

🌳JSON Support & Tree Shaking

当你通过ES模块的方式引入JSON,webpack会剔除JSON模块没有用到的导出。当你从JSON引入了一堆没有用到的部分,webpack4的打包体积会更小。

😍升级到UglifyJS2

意味着你可以直接用ES6的语法压缩,而不用先翻译到es5语法。

我们必须感谢uglifyjs2的团队无私和艰难的工作,去支持es6。这不是一个简单的工作,希望你去对他们的工作表示赞赏和支持

UglifyJS2现在支持ES6语法!

🐐 模块类型添加.mjs支持

过去,javascript是webpack唯一支持的语言模块。这形成了一些想用css和html作为模块的用户的痛点。现在我们完全抽象了javascript特性用来支持新的api。目前我们提供了五个模块类型实现:

作为这个功能最大好处就是,现在我们支持css和html作为模块。这将允许你以html作为入口文件。

🔬WebAssembly支持

webpack现在支持importexport本地WebAssembly模块。这意味着你可以实现loaders支持Rust,C++,C 和其他WebAssmbly支持的语言。

💀再见 CommonsChunkPlugin

我们移除了CommonsChunkPlugin,同时默认支持了更多的特性。对于希望细粒度控制缓存的用户,我们添加了 optimization.splitChunksoptimization.runtimeChunk提供了更丰富更灵活的功能。

💖当然还有更多!

这里还有更多的功能需要你去探索,在官方文档

⌚计时开始

作为承诺,我们还有一个月的时间去发布webpack4的稳定版。这有充足的时间让我们测试plugin,loaders和生态系统。

我们需要你们的帮助测试和提升这个beta版。你们测试的越多,就能帮助我们更快的解决问题。

感谢每一个为webpack4贡献的小伙伴。就像我们说的,webpack的能力是我们每个人的功劳。


等不及去贡献?想成为一个webpack的贡献者或者赞助者,赞助地址。赞助不仅给核心团队,而且还给了花费大量时间改善我们组织的空闲时间的贡献者!❤

上一篇 下一篇

猜你喜欢

热点阅读