问题标签 [storybook]

我已经设置了要在 Storybook 中呈现的 ag-grid。但是，当 Storybook 出现时，什么都没有显示，并且 Chrome 控制台中显示以下错误：

我怀疑这是因为在 Storybook 模块中没有正确设置 ag-grid。以下是我的设置方式 - 使用 Storybook 装饰器：

知道我做错了什么吗？完整的项目可以在Github上找到，特别是 Storybook 的故事在这里。

对于一个新项目，我正在使用 Lerna 和 React Storybook。我想创建一个包含多个包的 monorepo。

我的文件夹结构如下所示：

我想从我的按钮包中的主题包中导入主题，我通过 npm 在我的按钮包中安装它。

在我的按钮包中，我正在导入主题

import theme from '@company/company-theme';

我收到以下错误：

Module not found: Error: Can't resolve '@company/company-theme' in buttonpath

起初我认为这是一个 babel 问题，我在 package.json 中安装了以下 babel 包

在 projectroot 和按钮根目录中，我创建了一个.babelrc并添加了以下代码：

然而问题仍然存在。这里有人知道该怎么做吗？

这是我在 .storybook 文件夹中的 webpack.config.js

这是我的tsconfig.json配置文件

当我尝试scss在我的任何反应组件中导入任何文件时，我得到模块未找到错误。

请指导我如何配置webpack.config.js以支持我的tsx文件中的scss import

我已按照此处的说明使antd与CRA一起正常工作。但是在从storybook使用它时，我遇到了一个错误：

针对 mixin 构建失败，并显示未启用消息内联 JavaScript。它在您的选项中设置吗？

我已经修复了关于我在这里提出的问题的以下建议。

现在，storybook能理解antd 但不能按需导入组件。故事书必须单独配置 babel 吗？

1 . 在使用import { Button } from "antd"; 我得到这个：

2 . 关于使用

我得到：

故事书版本：“@storybook/react”：“^3.4.8”

依赖：“antd”：“^3.7.3”

我已经（再次）被这个问题困扰了很长时间，在谷歌上搜索东西，感谢任何帮助。谢谢！

我尝试使用 Storybook 设置 React Native，并且在导入.tsx组件时收到错误消息：
React is not defined

在我的代码中，我有下一个：

TammIcon 的第二次使用给了我

调试后我发现TammIcon组件没有正确导入并使用

```

```

但它看起来很丑，而且很奇怪。有没有办法解释这种行为？

PS 另一种解决方法（代码更少，但仍然很奇怪）是使用 IIF 而不是静态值（缓存/计算时间看起来有问题）

在我们的应用程序中，我们使用绝对路径进行导入。例如，如果我们有一个相对于src文件夹的路径，我们可以只写import module from "components/myComponent".

问题是这在故事书中不起作用。经过一番挖掘，事实证明您可以采用默认的 webpack 配置并根据需要对其进行扩展，如此处的文档中所示。我基于此的思考过程是src像这样简单地将我的目录推送到模块数组上，

然而，在这样做之后，我在尝试运行故事书时最终收到以下错误。

./node_modules/@storybook/addon-knobs/src/react/index.js 中的错误模块解析失败：意外令牌 (26:9) 您可能需要适当的加载程序来处理此文件类型。| 常量初始内容 = 获取故事（上下文）；| const props = { 上下文，storyFn：getStory，频道，knobStore，initialContent }; | 返回 ; | }; |

真的不知道从这里去哪里。

是否可以将 react-testing-library 与 storybook storyshots 插件一起使用？我想为不使用酶的反应成分生成一些测试。

我尝试用 Nuxt 项目中的组件制作故事书。到目前为止，我看到了组件，但它们都至少使用一个模块，我找不到导入它们的方法。我似乎并不孤单
（https://forum.vuejs.org/t/nuxt-js-and-storybook/26239，https://github.com/derekshull/nuxt-starter-kit-
v2/issues/1），
但我希望有人找到解决方案。

.storybook/webpack.config.js：

.storybook/config.js：

我有一个简单的故事书项目，其结构如下：

我可以运行我的配置start-storybook -p 6006

现在我想包含一些组件，它们是后面的目录。所以新的文件结构是：

我的配置现在从一个目录中调用故事：

但似乎故事书现在无法解析文件，即使唯一的变化是故事已被移回文件。我收到以下错误：

我是否需要一些自定义解析器配置，.babelrc或者这会与默认的故事书配置发生冲突。也许故事书有一些设置可以处理这个目录结构？

编辑 已尝试向我的 webpack 配置添加更多配置以允许解析 JSX，但无济于事。

收到以下错误：