Rollup最近发布了它的第一个主要迭代版本。开发者可以使用 Rollup 1.0 对他们的库进行代码拆分，并暴露多个导入目标。
Rollup 1.0 发布公告给出了一个假想的库的例子，它有四个入口点，对应于每个导出的库函数：
Rollup 1.0 将 8 个模块减少到 5 个块，每个入口模块对应一个块，还有一个被其他几个块导入的块。每个块本身就是标准的 ES 模块，它们使用浏览器的内置模块加载器进行加载，没有任何额外的运行时开销，同时还可以利用 Rollup 的摇树优化功能。
对应的 Rollup 配置由一个 rollup.config.js 文件组成，文件内容如下:
入口点通过 input 属性来指定，输出目录通过 output 属性来指定。然后在 package.json 文件中引用目录：
代码拆分可以将代码基库拆分成更小的块，这些块可以按需加载。将这项技术应用于整个 Web 应用程序上时，用户可以更快地获得可交互的页面，而不必等待完整的包被执行。将这项技术应用于库上时，用户可以从单独的文件导入库的独立部分。例如，使用 import merge from ‘lodash-es/merge’来导入 merge 函数。用户还可以使用以下命令从 lodash 中导入任意数量的函数：
Rollup 的主要贡献者 Lukas Taegert 指出，“当然，你也可以使用 Rollup 来捆绑 Web 应用程序（通过动态导入进行代码拆分）”。Rollup的文档中提供了一个额外的示例。
Rollup 在 2016 年率先使用摇树来优化应用程序包。Rollup 的目标是为 JavaScript 库生成“看起来是由人类编写的最高效的包”。代码拆分是在 Rollup 0.55 中引入的。后来，经过了一些 bug 修复和改进，被包含在 Rollup 1.0 中。
Webpack 始于 2012 年，目标是构建复杂的单页应用程序（SPA）。为此，Webpack 引入了代码拆分和静态资产捆绑功能。Webpack 在它的第二个主要迭代版本中引入了基本的摇树优化功能。
查看英文原文：https://www.infoq.com/news/2019/03/rollup-code-splitting
暂无签名
中国开发者画像洞察研究报告 2024
分析开发者的行为模式、工作价值、职业发展等内容，帮助整个行业生态更深入地理解开发者，为他们提供更精准...
评论 1 条评论