AI实践哪家强?来 AICon, 解锁技术前沿,探寻产业新机! 了解详情
写点什么

Rollup 1.0 发布,支持对捆绑包进行代码拆分

  • 2019-04-12
  • 本文字数:1096 字

    阅读完需:约 4 分钟

Rollup 1.0发布,支持对捆绑包进行代码拆分

Rollup最近发布了它的第一个主要迭代版本。开发者可以使用 Rollup 1.0 对他们的库进行代码拆分,并暴露多个导入目标。


Rollup 1.0 发布公告给出了一个假想的库的例子,它有四个入口点,对应于每个导出的库函数:



Rollup 1.0 将 8 个模块减少到 5 个块,每个入口模块对应一个块,还有一个被其他几个块导入的块。每个块本身就是标准的 ES 模块,它们使用浏览器的内置模块加载器进行加载,没有任何额外的运行时开销,同时还可以利用 Rollup 的摇树优化功能。


对应的 Rollup 配置由一个 rollup.config.js 文件组成,文件内容如下:


export default     {        input: {            index: 'src/main.js',            upper: 'src/upper.js',            lower: 'src/lower.js',            upperFirst: 'src/upperFirst.js'        },        output: [            {                dir: 'esm',                format: 'esm'            },            {                dir: 'cjs',                format: 'cjs'            }        ]    }
复制代码


入口点通过 input 属性来指定,输出目录通过 output 属性来指定。然后在 package.json 文件中引用目录:


{  "name": "fancy-case",  "version": "1.0.0",  "main": "cjs/index.js",  "module": "esm/index.js",  "scripts": {    "prepare": "rollup --config"  },  "files": [    "cjs/*",    "esm/*"  ],  "devDependencies": {    "rollup": "^1.0.0"  }}
复制代码


代码拆分可以将代码基库拆分成更小的块,这些块可以按需加载。将这项技术应用于整个 Web 应用程序上时,用户可以更快地获得可交互的页面,而不必等待完整的包被执行。将这项技术应用于库上时,用户可以从单独的文件导入库的独立部分。例如,使用 import merge from ‘lodash-es/merge’来导入 merge 函数。用户还可以使用以下命令从 lodash 中导入任意数量的函数:


import { partition, memoize } from ‘lodash-es’;
复制代码


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


2019-04-12 09:265035
用户头像

发布了 731 篇内容, 共 468.7 次阅读, 收获喜欢 2007 次。

关注

评论 1 条评论

发布
用户头像
Rollup可以替代webpack在生产环境中吗?
2019-04-12 15:43
回复
没有更多了
发现更多内容

变革加速,博睿数据赋能“中国智造”转型升级

博睿数据

可观测性 智能运维 博睿数据

算法基础(二)| 高精度算法详解

timerring

算法 9月月更

如何设计企业级数据埋点采集方案?

字节跳动数据平台

数据分析 用户增长 埋点 数据应用 埋点设计

“双减”一年,如何让教育回归本质?

旺链科技

区块链 产业区块链 企业号九月金秋榜 教培行业

全新演绎!美团内部疯传Spring Boot速成手册也太香了叭!

收到请回复

Java 云计算 开源 架构 编程语言

小红书自研小程序:电商体验与效果优化的运行时体系设计

小红书技术REDtech

小程序 前端 小程序运行时

百度App Android启动性能优化-工具篇

百度Geek说

android 性能优化 企业号九月金秋榜

关关难过关关过!2022年BAT面试通关秘籍:面前规划+面试题集+简历优化+面经分享等!

收到请回复

Java 云计算 开源 架构 编程语言

SpringBoot源码 | refreshContext方法解析

六月的雨在InfoQ

源码 springboot 源码阅读 9月月更 refreshContext

【指针内功修炼】字符指针 + 指针数组 + 数组指针 + 指针参数(一)

Albert Edison

C语言 二维数组 9月月更 指针数组 数组指针

面试造火箭!连续轰炸50问,我却靠这些"java复习宝典"一一攻克!

收到请回复

Java 云计算 开源 架构 编程语言

FreeRTOS记录(八、用软件定时器?还是硬件定时器?)

矜辰所致

软件定时器 FreeRTOS 9月月更

一文带你体验MRS HetuEngine如何实现跨源跨域分析

华为云开发者联盟

大数据 后端 企业号九月金秋榜

HUAWEI DevEco Testing注入攻击测试:以攻为守,守护OpenHarmony终端安全

OpenHarmony开发者

OpenHarmony

带您了解昇腾模型压缩工具

华为云开发者联盟

人工智能 后端 企业号九月金秋榜

高并发之缓存

源字节1号

软件开发

从零到一构建完整知识体系,阿里最新SpringBoot原理最佳实践真香

程序员小毕

Java spring 源码 面试 SpringBoot 2

“大厂”角力移动办公系统市场,钉钉和企微向左、WorkPlus向右

BeeWorks

手把手教大家编译 flowable 源码

江南一点雨

Java workflow flowable

漏洞修复实用指南

SEAL安全

开源 漏洞 安全漏洞 漏洞修复 开源漏洞

关于用户 email 邮件地址是否允许有加号的问题

汪子熙

typescript 正则表达式 邮件 9月月更 输入校验

华为云快成长直播ERP专场,以数据驱动企业智慧变革

科技怪咖

华为云快成长直播间大数据&AI专场,加速经济物联网智能化提升

科技怪咖

预约直播 | 大规模稀疏模型演进与DeepRec

阿里云大数据AI技术

开源项目 AI技术 模型稀疏训练

重磅!阿里首推内部“SpringCloudAlibaba项目文档”这细节讲解,封神!

收到请回复

Java 云计算 开源 架构 编程语言

7.07亿TPC-C背后的技术突破,OceanBase研究成果入选VLDB

OceanBase 数据库

推荐|海泰国密通信安全解决方案 助力用户实现安全合规

电子信息发烧客

阿里大佬力荐6篇实战文档:JVM+多线程+Kafka+Redis+Nginx+MySQL,你确定不看?

收到请回复

Java 云计算 开源 架构 编程语言

Paper Time|开放式时空大数据助力智能公交路线规划

OceanBase 数据库

京东金融客户端用户触达方式的探索与实践

京东科技开发者

京东 用户 用户触达 widget 推送

阿里云张新涛:连接产业上下游,构建XR协作生态

阿里云弹性计算

交互 XR 视觉计算 沉浸式体验

Rollup 1.0发布,支持对捆绑包进行代码拆分_编程语言_Bruno Couriol_InfoQ精选文章