javascript - React Styleguidist のドキュメントでは、他のコンポーネントを子として使用できません

Question

React Styleguidist (バージョン 8.0.6) を使用して React コンポーネントを文書化しています。次のようなディレクトリ構造があります。

Card
- Card.js
- Card.md
ActionItems
- ActionItems.js
- ActionItems.md

これら 2 つのコンポーネントはそれぞれ、独自の Styleguidist 生成ページで正しくレンダリングされます。

ただし、Card.md次のように、Card の例の 1 つに<ActionItems/>コンポーネントを子として含める必要があります。

<Card>
    <ActionItems/>
</Card>

他の誰かがこのようなことをしている唯一の例は、このスタックオーバーフローの投稿です。

次を my に入れるとCard.md:

```jsx
<Card someAttr="foo">
    <ActionItems someOtherAttr="bar"/>
</Card>
```

Styleguidist のエラーはSyntaxError: Expected corresponding JSX closing tag for <React.Fragment>.

以前にリンクしたスタックオーバーフローの記事に従って、これを試しました

```jsx
const ActionItems = require('../ActionItems/ActionItems.js');

<Card someAttr="foo">
    <ActionItems someOtherAttr="bar"/>
</Card>
```

しかし、Styleguidist は別のエラーを表示します: Adjacent JSX elements must be wrapped in an enclosing tag.

誰かが私が間違っていることを理解するのを手伝ってくれますか? それとも、Styleguidist は、私がやりたいことをあなたに許可しないのですか?

関連する場合、必要なパスを他のものに変更すると、たとえば'/www/javascript/ActionItems/ActionItems.js、Styleguidist は次のメッセージで失敗します

Failed to compile
Module not found: Can't resolve '/www/javascript/ActionItems/ActionItems.js' in '/www/javascript/react-components/Card'

0 に答える 0