reactjs - 如何在 Storybook 中使用 React 中的全局变量

Question

我找到了 this回答，但我无法用它解决问题。

我尝试在 Storybook 中加载的组件取决于通过 CDN 在 index.html 中注入(inject)的全局变量。

为了访问组件中的变量，我在文件顶部添加了这条注释

/*global <variable name>*/

它在 React 应用程序中运行良好，但 Storybook 抛出此错误:<variable name> is not defined .

我尝试在 stories.js 的顶部添加该评论文件和配置文件的顶部。 - 运气不好。

CDN 的 URL 在一个 env 文件中。从看this doc 我尝试在 HTML 文件中添加第二个脚本，其中包含一个以 STORYBOOK_ 为前缀的环境变量.那也没用。

关于我可以做些什么来克服这个问题有什么想法吗？

Answer 1

我通过添加自定义头部标签解决了这个问题:https://storybook.js.org/docs/configurations/add-custom-head-tags/#docs-content

然后在那里添加我的全局变量，例如:

// preview-head.html
<script>
var foo = bar
</script>