Rollup 中如何配置 format 选项？

推荐答案

在 Rollup 中，format 选项用于指定生成的 bundle 的模块格式。常见的格式包括 es、cjs、iife、umd 和 amd。你可以在 Rollup 配置文件中通过 output.format 来设置。

export default {
  input: 'src/main.js',
  output: {
    file: 'bundle.js',
    format: 'cjs' // 可以是 'es', 'cjs', 'iife', 'umd', 'amd'
  }
};

本题详细解读

format 选项的作用

format 选项决定了 Rollup 如何将模块打包成最终的输出文件。不同的格式适用于不同的环境和需求：

• es: 输出为 ES 模块格式，适用于现代浏览器或支持 ES 模块的环境。
• cjs: 输出为 CommonJS 格式，适用于 Node.js 环境。
• iife: 输出为立即执行函数表达式 (IIFE)，适用于浏览器环境，通常用于直接嵌入到 HTML 中。
• umd: 输出为通用模块定义 (UMD)，适用于多种环境，包括浏览器和 Node.js。
• amd: 输出为异步模块定义 (AMD)，适用于 RequireJS 等 AMD 模块加载器。

配置示例

以下是一个完整的 Rollup 配置文件示例，展示了如何配置 format 选项：

-- -------------------- ---- -------
------ ------- -
  ------ --------------
  ------- -
    ----- ------------
    ------- ------ -- --- -------- --
    ----- ------------ -- - ------ - ------ - ----- -----------
    -------- -
      ------- --- -- ----------------
    -
  --
  --------- ---------- -- ------
--

注意事项

• 当使用 iife 或 umd 格式时，通常需要指定 name 选项，以便在全局作用域中暴露模块。
• 如果使用了外部依赖（通过 external 选项指定），则需要通过 globals 选项来映射这些依赖的全局变量名。
• es 格式通常用于现代前端开发，而 cjs 格式则更适合 Node.js 环境。