如何配置 Rollup 实现多入口打包?

推荐答案

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

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

本题详细解读

多入口打包的概念

多入口打包是指在一个项目中,存在多个入口文件,每个入口文件都会生成一个独立的输出文件。这在大型项目中非常常见,尤其是当项目需要拆分为多个模块或功能时。

Rollup 配置多入口打包

在 Rollup 中,可以通过导出一个数组来实现多入口打包。数组中的每个对象代表一个独立的入口配置,包含 inputoutput 等属性。

  • input: 指定入口文件的路径。
  • output: 配置输出文件的路径和格式。
  • plugins: 配置使用的插件,如 @rollup/plugin-node-resolve 用于解析第三方模块,@rollup/plugin-commonjs 用于将 CommonJS 模块转换为 ES6 模块。

示例配置

在示例配置中,我们有两个入口文件 index1.jsindex2.js,分别生成 bundle1.jsbundle2.js。每个入口配置都使用了 resolvecommonjs 插件来处理模块依赖。

注意事项

  • 确保每个入口文件的路径正确。
  • 如果项目中有多个输出格式(如 cjsesm 等),可以在 output 中分别配置。
  • 插件配置可以根据项目需求进行调整,例如添加 babel 插件来处理 ES6+ 语法。
纠错
反馈