Русалка в табах

Стрелки не отображаются на второй вкладке. Ошибка?
Здесь работает https://docusaurus.io/tests/pages/diagrams#mermaid-in-tabs

У меня есть:

а) Во вкладке «а» отображаются стрелки:

б) А вот в "tab-b" стрелки не отображаются:

Версия докузавра: 2.2.0
Тип файлов: .md или .mdx

import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';

<Tabs>
<TabItem value = "tab-a">

The following mermaid diagram is shown:

```mermaid
graph LR
  a ---> c(10)
  b ---> c(10)
```

</TabItem>

<TabItem value = "tab-b">

This mermaid diagram is not displayed:

```mermaid
graph LR
  d ---> z(42)
  e ---> z(42)
```

</TabItem>
</Tabs>

[РЕШЕНО]Перейти к решению

115

1

Docusaurus31 вопрос Mermaid38 вопросов

Решено

Я скопировал/вставил код из вашей ссылки на docussaurus, чтобы увидеть проблему.

Я считаю, что это действительно ошибка...

Вот как мне удалось обойти:

import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';

# Mermaid in tabs


<!-- [start] add this to avoid the possible bug. Note: the empty line before [```] is necessary -->
```mermaid
flowchart TD

```
<!-- [end] add this to avoid the possible bug -->


<Tabs>
<TabItem value = "tab-a">

```mermaid
graph LR
  a ---> c(10)
  b ---> c(10)
```

</TabItem>

<TabItem value = "tab-b">

```mermaid
graph LR
  d ---> z(42)
  e ---> z(42)
```

</TabItem>
</Tabs>

НОТЫ

Я скачал сработавшую страницу с docusaurus;
Я обрезал весь код, пока он не сломался;
Я тестировал, пока не нашел способ отобразить «желаемый» результат без каких-либо дополнительных «артефактов»;
Теперь у нас есть рабочий код, но это обходной путь.

Русалка в табах

Ответ:

Интересные вопросы для изучения