Rollup中文文档-配置文件

命令行接口

Rollup通常应该从命令行使用。你可以提供一个Rollup的配置文件,简化命令行使用,并启用Rollup的高级功能。

配置文件

配置文件通常创建为rollup.config.js或者rollup.config.mjs并且位于项目根目录。

.js是传统的javascript文件,默认使用CommonJs模块系统。在.js中,需要使用require和module.exports。
.mjs是ECMAScript模块(ES Modules),是javascript的模块化标准,允许将代码拆分为多个独立的模块,并通过importexport进行模块之间的交互。

当你在Node环境中使用.mjs文件的时候,需要在package.json中指定type:module。告诉Node解析器该项目使用的是ES模块。

配置文件通常是一个ES模块,导出一个默认的对象,其中包含所需的选项:

ECMAScript 复制代码
export default {
    input: 'index.js',
    output: {
        file: 'bundle.js',
        format: 'cjs'
    }
}

Rollup将直接使用Node导入该文件。请注意一下,使用原生Node ES模块时存在一些注意事项,因为Rollup将遵循NodeESM语义

如果你想使用requiremodule.exports编写CommonJS模块,可以将扩展名改成.cjs

也可以用Typescript,安装相应Rollup插件,例如@rollup/plugin-typescript,并使用--configPlugin选项。

arduino 复制代码
rollup --config rollup.config.ts --configPlugin typescript

使用--configPlugin选项将始终强制你的配置文件转换为CommonJS格式。

配置文件中可以导出一个数组,这样可以从多个不相关的输入进行打包,即使在监视模式下也可以。如果要使用相同的输入打出不同的包,你要为每个输入提供一个一个输出的选项数组。

lua 复制代码
export default [  
 {
     input: 'index-a.js',
     output: {
         file: 'dist/bundle-a.js',
         format: 'cjs'
     }
 },
 {
     input: 'index-b.js',
     output: [
         {
             file: 'dist/bundle-a.1.js',
             format: 'cjs'
         },
         {
             file: 'dist/bundle-a.2.js',
             format: 'es'
          }
     ]
 }
];

如果想异步创建配置文件,Rollup也可以处理解析为对象或数组的Promise.

arduino 复制代码
// rollup.config.js  
import fetch from 'node-fetch';  
 
export default 
fetch('/some-remote-service-which-returns-actual-config');

如果使用配置文件去创建Rollup配置,执行命令的时候需要带上--config参数。

还可以通过导出一个返回配置格式的函数。该函数将传递当前的命令行参数,以便可以动态的调整你的配置。

填写配置时的智能提示

可以用JSDoc类型提示来利用你的IDE的智能感知功能。或者,你可以使用defineConfig,它应该提供了无需JSDoc注释即可使用智能感应的功能:

javascript 复制代码
import {defineConfig} from 'rollup'

export default defineConfig({

})

除了RollupOptions和封装了该类型的defineConfig辅助函数之外,以下类型也可能会很有用:

  • OutputOptions: 配置文件output的部分
  • Plugin: 提供name和一些勾子的插件对象。所有狗子都是完全类型化的,帮助插件开发。
  • PluginImpl: 将选项对象映射到插件对象的函数。大多数公共的Rollup插件都将遵循这种模式。

从一个NPM包加载配置

为了实现互操作性,Rollup还支持从node_modules中的包加载配置文件:

arduino 复制代码
rollup --config node:my-special-config
相关推荐
UncleKyrie几秒前
🎨 市面上主流 Figma to Code MCP 对比
前端
南半球与北海道#13 分钟前
前端引入vue-super-flow流程图插件
前端·vue.js·流程图
然我20 分钟前
React 16.8:不止 Hooks 那么简单,这才是真正的划时代更新 🚀
前端·react.js·前端框架
小高00733 分钟前
📈前端图片压缩实战:体积直降 80%,LCP 提升 2 倍
前端·javascript·面试
OEC小胖胖36 分钟前
【React Hooks】封装的艺术:如何编写高质量的 React 自-定义 Hooks
前端·react.js·前端框架·web
BillKu44 分钟前
vue3+element-plus 输入框el-input设置背景颜色和字体颜色,样式效果等同于不可编辑的效果
前端·javascript·vue.js
惊悚的毛毛虫1 小时前
掘金免广告?不想看理财交流圈?不想看exp+8?
前端
springfe01011 小时前
vue3组件 - 大文件上传
前端·vue.js
再学一点就睡1 小时前
Vite 工作原理(简易版)—— 从代码看核心逻辑
前端·vite
好好好明天会更好1 小时前
uniapp项目中小程序的生命周期
前端·vue.js