前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Webpack 4正式发布,实现零配置启动

Webpack 4正式发布,实现零配置启动

作者头像
CRPER
发布2023-06-09 14:30:07
2390
发布2023-06-09 14:30:07
举报
文章被收录于专栏:CRPER折腾记CRPER折腾记

Webpack 4 正式发布,代号为 Legato,包括多项重要更新,特别是增加了 0 配置特性,可以视为对前阵子大火的 Parcel 的有力回击。

你可以使用以下代码安装:

代码语言:javascript
复制
$> yarn add webpack --dev
//or
$> npm i webpack --save-dev

更新和改进包括:

  • 性能大幅提升,从官方团队收集的案例显示,性能有从 60%-98% 的提升。并且这是在未添加多核支持和持久化缓存的情况下,意味着性能还有提升空间。
  • 新增 mode 配置,可选择设置为 development 或 production,默认值为 production,它们的主要区别是 development 更重视构建时间,production 更重视尺寸。并且,有了 mode 之后,无需配置即可启动,实现了零配置。
  • 使用 optimize.splitChunks 和 optimization.runtimeChunk 替代 CommonsChunkPlugin。现在开发者可以更简单的实现代码分割和提取公共代码等操作。
  • 支持 WebAssembly,现在可以导入入 WebAssembly 支持的其它语言文件。
  • 支持 CommonJS, AMD, ESM 等模块系统,可以直接导入.mjs 扩展名的模块文件,对 wasm 模块也有实验性的支持。

众多主流前端框架的 CLI 工具将积极跟进这一升级,数周内将发布的 Angular 新版本将直接集成 Webpack 4.

需要注意的是,此次升级对于诸多 plugin 和 loader 来说是破坏性升级,之前官方团队给生态里的伙伴留了一些时间让他们适配此次升级,不过有些未能做到,如 HtmlWebpackPlugin 暂时未能同步升级,Webpack 团队为它创建了一个 fork 来使其支持 4.0 版本,使用方法:

代码语言:javascript
复制
$> yarn add html-webpack-plugin@webpack-contrib/html-webpack-plugin

其它更多更新细节见发布说明:

https://github.com/webpack/webpack/releases/tag/v4.0.0

Webpack 团队还为这些新特性撰写了一系列介绍文章,可前往阅读:

https://medium.com/webpack/webpack-4-mode-and-optimization-5423a6bc597a

https://medium.com/webpack/webpack-4-code-splitting-chunk-graph-and-the-splitchunks-optimization-be739a861366

https://medium.com/webpack/webpack-4-migration-guide-for-plugins-loaders-20a79b927202

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
云开发 CLI 工具
云开发 CLI 工具(Cloudbase CLI Devtools,CCLID)是云开发官方指定的 CLI 工具,可以帮助开发者快速构建 Serverless 应用。CLI 工具提供能力包括文件储存的管理、云函数的部署、模板项目的创建、HTTP Service、静态网站托管等,您可以专注于编码,无需在平台中切换各类配置。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档