如何共享汇总配置文件

Question

我有 2 个汇总配置文件，其中包含一些常见部分和不常见部分：

 // rollup.config.umd.js
  export config {
     external: ['invariant', 'lodash'],
     globals: {
      invariant: 'invariant'
     },
     input: 'src/index.js',
     name: 'my.comp',
     output: {
       file: 'my.comp.umd.js'
       format: 'umd'
     }...

和另一个文件

 // rollup.config.esm5.js
  export config {
     external: ['invariant', 'lodash'],
     globals: {
      invariant: 'invariant'
     },
     input: 'src/index.js',
     name: 'my.comp',
     output: {
       file: 'my.comp.es5.js'
       format: 'es'
     }...

如何让这些配置文件保持干燥？

不保持 DRY 有以下问题，例如想象一下许多外部依赖项——如果忘记在一个地方添加新的依赖项，我们就有麻烦了。

（我也使用了一些不同的插件等和插件配置，但我说这超出了这个问题的范围。）

Answer 1

首先，它们只是 JavaScript 个模块，因此您可以随时执行此类操作：

// rollup.config.common.js
export default {
  external: ['invariant', 'lodash'],
  globals: {
    invariant: 'invariant'
  },
  input: 'src/index.js',
  name: 'my.comp'
};

// rollup.config.esm5.js
import common from './rollup.config.common.js';

export default Object.assign({
  output: {
   file: 'my.comp.es5.js'
   format: 'es'
 }
}, common);

// rollup.config.umd.js
import common from './rollup.config.common.js';

export default Object.assign({
  output: {
   file: 'my.comp.umd.js'
   format: 'umd'
 }
}, common);

但真正的答案是像这样将两个配置组合成一个：

export default {
  external: ['invariant', 'lodash'],
  globals: {
    invariant: 'invariant'
  },
  input: 'src/index.js',
  name: 'my.comp',
  output: [
    {
      file: 'my.comp.es5.js'
      format: 'es'
    },
    {
      file: 'my.comp.umd.js'
      format: 'umd'
    }
  ]
};

除了更简单和更容易维护之外，这会更快，因为 Rollup 可以节省两次重复的工作。

如果您需要在构建之间更改超过 output 选项，您还可以从单个文件 (export default [...]) 中导出一组配置。

如何共享汇总配置文件

how to share rollup config files

rollupjs