storybook [Bug]: 当在preview-head.html中通过CDN导入requirejs时,渲染MDX会中断,

z5btuh9x  于 2个月前  发布在  其他
关注(0)|答案(4)|浏览(49)

描述bug

preview-head.html的MDX渲染中,添加带有requirejs的脚本标签时出现问题。

<script
  src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js"
  integrity="sha512-c3Nl8+7g4LMSTdrm621y7kf9v3SDPnhxLNhcjFJbKECVnmZHTdo+IRO05sNLTH/D3vA6u1X32ehoLC7WFVdheg=="
  crossorigin="anonymous"
  referrerpolicy="no-referrer"
></script>

我报告这个问题,因为花了很长时间才弄清楚MDX渲染出了什么问题,起初以为是7.0.0-beta.54版本的问题。毕竟是我自己的问题。

重现步骤

7.0.0-beta.54

系统环境

Environment Info:
  System:
    OS: macOS 12.6.1
    CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
  Binaries:
    Node: 18.12.1 - ~/.nvm/versions/node/v18.12.1/bin/node
    Yarn: 1.22.18 - ~/.yarn/bin/yarn
    npm: 8.19.2 - ~/.nvm/versions/node/v18.12.1/bin/npm
  Browsers:
    Chrome: 110.0.5481.177
    Firefox: 110.0
    Safari: 16.1

附加背景信息

这个问题出现在NX webcomponents仓库中的最新Storybook 7.0.0-beta.54中。这不是一个紧急的问题,但是一个奇怪的问题。不知道导入requirejs的政策和紧迫性。我认为requirejs应该只在iframe沙箱中可用,而不会影响与Storybook相关的库。

tquggr8v

tquggr8v1#

这在7.0.11版本中仍然存在,
有人知道解决方法吗?或者我应该向覆盖滚动条组件提交一个问题?

kuuvgm7e

kuuvgm7e2#

可复现示例:https://stackblitz.com/edit/github-d8u6zg?file=src%2Fstories%2FIntroduction.mdx
无论何时显示代码,或在文档块中,或在使用反引号时,当requirejs在头部导入时,storybook会在此处中断。

cotxawn7

cotxawn73#

herrKlein,你找到解决方案了吗?我遇到了相同的问题。

vyu0f0g1

vyu0f0g14#

@herrKlein 你找到解决方案了吗?我遇到了相同的问题。
很遗憾没有,尝试了所有方法,包括修改requirejs的名称、使用requirejs的闭包...尝试使用https://www.npmjs.com/package/requirees,我认为它应该是一个用于requirejs的es加载器。也许我们应该在第三方库中报告这个错误:https://kingsora.github.io/OverlayScrollbars/,这是storybook指出问题所在的地方。希望storybook能更新这个库。如果你找到了解决方案,请告诉我。

相关问题