javascript - 对 rollup.js 外部使用 glob 或正则表达式模式

Question

是否可以在我的汇总配置中对外部使用 glob 或正则表达式模式？使用此配置:

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,
  ...
};