Question

是否可以在汇总配置中为外部使用glob或regex模式？使用此配置：

export default {
  ...
  external: [
    'prop-types',
    'react',
    'prettier/standalone',
    'prettier/parser-babylon',
    'react-syntax-highlighter/prism-light',
    'react-syntax-highlighter/languages/prism/jsx',
    'react-syntax-highlighter/styles/prism/tomorrow',
    'react-element-to-string'
  ],
  ...
};

我想做类似的事情：

export default {
  ...
  external: [
    'prop-types',
    'react',
    'prettier/**',
    'react-syntax-highlighter/**',
    'react-element-to-string'
  ],
  ...
};

Answer 1

目前无法实现。但是，您可以使用函数来实现类似的功能：

export default {
  ...
  external(id) {
    return [
      'prop-types',
      'react',
      'prettier',
      'react-syntax-highlighter',
      'react-element-to-string'
    ].includes(id.split('/')[0]);
  },
  ...
};

您应该避免在此函数中进行昂贵的计算，因为这会被调用很多（确切地说，每个文件中的每次导入一次）。

另一种选择是将rollup-pluginutils程序包添加为包含createFilter function for glob support的依赖项：

import { createFilter } from 'rollup-pluginutils';

const external = createFilter([
  'prop-types',
  'react',
  'prettier/**',
  'react-syntax-highlighter/**',
  'react-element-to-string'
], null, {resolve: false});
// {resolve: false} will make sure these filters are not passed to
// path.resolve first and resolved against the current working directory

export default {
  ...
  external,
  ...
};

Answer 2

现在 rollup 也支持 external 中的正则表达式，如下所示：

export default {
  external: ['three', /three\/.*/]
}

这会将 three 和 three/* 标记为外部对象，我在我的项目中使用过，它按预期工作。

有关更多选项，请参阅 https://rollupjs.org/guide/en/#external。

将glob或regex模式用于rollup.js外部

2 个答案: