从0开始使用webpack4构建静态网站(一) - webpack4及安装

webpack4更新了太多东西,具体可以查询 webpack4更新日志,下面介绍一些主要特性:

1. webpack4更快,速度提升98%!

ps:还没有实现多进程和缓存功能,所以理论上性能还有更大的提升空间

2. Mode,零配置及默认值

我们为 webpack 新增了一个 mode 配置项。Mode 有两个值:development 或者是 production,默认值是 production。Mode 是我们为减小生产环境构建体积以及节约开发环境的构建时间提供的一种优化方案。

另外,entry,output 这些配置项也都有默认值了。这意味着你不需要每次都配置它们了,当然包括 mode。这可能意味着从现在开始,你的配置文件在我们做出如此巨大改变之后会变得非常小!

想要了解mode配置项的更多内容,可以参考 webpack4 Mode和优化

另外,我们提供零配置平台来扩展。webpack 最大的一个特色就是可扩展性。最终我们实现的零配置平台会是什么样子呢?当我们实现了 webpack presets 功能后,这意味着你可以基于零配置平台配置你自己,公司,甚至是社区的工作流配置用以继承直接使用。

3. 再见 CommonsChunkPlugin

在新版中我们废弃并移除了 CommonsChunkPlugin,并且使用一些默认值以及更容易被复写的新 API optimize.splitChunks 来代替它。现在你可以在大部分场景中享受自动分块带来的便利了!

想了解更多可以参考 webpack4 代码分块及分块优化

4. WebAssembly支持

5. 模块类型简介以及.mjs支持

安装:

webpack4需要比较新的node版本,目前最新的稳定版本是8.11.3

npm install --save-dev webpack

webpack4需要安装CLI

npm install --save-dev webpack-cli

参考文章:https://zhuanlan.zhihu.com/p/34028750


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值