- 持久缓存(Persistent Caching): Webpack 5引入了更好的持久缓存机制,利用了更稳定的HashedModuleIdsPlugin和NamedChunksPlugin,以改善构建性能。
- Tree-shaking 改进: Webpack 5对Tree-shaking进行了改进,提供了更好的代码优化,以便删除未使用的代码。
- 支持 WebAssembly(WASM): Webpack 5 对 WebAssembly 提供了原生的支持,使得在项目中使用 WebAssembly 更加方便。
- 支持 ES6 模块导入(Dynamic Import): Webpack 5对动态导入语法(import())提供了更好的支持,可以更轻松地进行代码分割。
- 模块联邦(Module Federation): 这是Webpack 5中的一项重大功能,允许将多个独立的Webpack构建连接在一起,实现模块共享,从而更好地支持微服务架构。
- 缓存组(Caching Groups): 新的缓存组概念被引入,可以更细粒度地控制模块的缓存策略。
- 内置代码分割优化(optimization.splitChunks): Webpack 5通过optimization.splitChunks进行了重新设计,提供了更灵活的配置选项,使得代码分割更为强大和易用。
- 默认配置优化: Webpack 5 默认配置中的一些优化,使得开箱即用的性能更好。
- 提高构建性能: Webpack 5引入了一些性能优化,包括更快的持久化缓存、更快的构建速度等。
- 移除废弃特性: 作为更新,Webpack 5移除了一些过时的特性和API,因此在升级时需要注意潜在的破坏性变化。
webpack 5 的主要升级点有哪些?
Posted on:2024年8月10日 at 17:07