Skip to main content

Docusaurus Markdown メモ

· One min read
pompopo
pompopo

公式ドキュメント

使いそうなもの​

Truncate​

truncate コメントで記事一覧ページでは表示したくない箇所を指定

Tabs​

🍎

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

<Tabs>
  <TabItem value="apple" label="Apple">
    🍎
  </TabItem>
  <TabItem value="orange" label="Orange">
    🍊
  </TabItem>
</Tabs>

Code blocks​

MyComponent.js
import React from 'react';

function MyComponent(props) {
  if (props.isBar) {
    return <div>Bar</div>;
  }

  return <div>Foo</div>;
}

export default MyComponent;
```jsx {1,4-6,11} showLineNumbers title="MyComponent.js"
import React from 'react';

function MyComponent(props) {
  if (props.isBar) {
    return <div>Bar</div>;
  }

  return <div>Foo</div>;
}

export default MyComponent;

コメントでもハイライトできる

  • highlight-next-line
  • highlight-start
  • highlight-end

Admonitions​

title

note, tip, info, warning, danger

:::info[title]

note, tip, info, warning, danger

:::

Diagrams​

Mermaidが使える。