Rollup.js 没有捆绑我的 React 组件库字体

Question

当我使用 Storybook 查看 React 组件库时，一切都运行良好。当我将库发布到 NPM 注册表时，我将其安装到虚拟 React 应用程序中，除了字体之外，一切都按预期工作。下面是我的 rollup.config.js 插件：

plugins: [
    external(),
    babel({
      exclude: 'node_modules/**',
      babelHelpers: 'bundled',
    }),
    del({ targets: ['dist/*'] }),
    postcss(),
    url({
      include: ['**/*.woff'],
      limit: Infinity,
    }),
    copy({
      targets: [{ src: ['./src/fonts'], dest: 'dist' }],
    }),
],

这是我的 font.scss

@font-face {
  font-family: 'CustomFontExample';
  src: local('CustomFontExample'),
    url('/fonts/CustomFontExample.woff')
      format('woff')
}

我相信问题要么存在于我的 Rollup.config.js 中，要么我没有正确设置我的 @font-face 路径。我目前将其设置为相对路径，当我在 Storybook 中查看组件时，该路径工作得很好。

有人知道我该如何解决这个问题吗？