1
|
"use strict";(self.webpackChunkdocuments=self.webpackChunkdocuments||[]).push([[2717],{44168:n=>{n.exports=JSON.parse('{"blogPosts":[{"id":"/2024/01/27/docusaurus-admonition-heading-toc","metadata":{"permalink":"/docs/blog/2024/01/27/docusaurus-admonition-heading-toc","source":"@site/blog/2024/01/27/docusaurus-admonition-heading-toc/index.mdx","title":"Docusaurus\u306e\u6ce8\u610f\u66f8\u304d\u3084\u8b66\u544a\u6587\u306e\u30bf\u30a4\u30c8\u30eb\u3092\u898b\u51fa\u3057\u306b\u3057\u3066\u3001\u76ee\u6b21\u306b\u3082\u4e57\u305b\u308b\u65b9\u6cd5","description":"Docusaurus\uff08V3.1\uff09\u3067\u306f\u3001\u6ce8\u610f\u66f8\u304d\u3084\u8b66\u544a\u6587\uff08Admonition\uff09\u306f\u898b\u51fa\u3057\uff08Heading\uff09\u306b\u306f\u306a\u3089\u305a\u76ee\u6b21\u306b\u3082\u63b2\u8f09\u3055\u308c\u306a\u3044\u306e\u3067\u3001Remark/Rehype\u306e\u30d7\u30e9\u30b0\u30a4\u30f3\u3068Swizzle\u3092\u6d3b\u7528\u3057\u3066\u5b9f\u73fe\u3057\u307e\u3057\u305f\u3002","date":"2024-01-27T00:00:00.000Z","formattedDate":"2024\u5e741\u670827\u65e5","tags":[{"label":"\u6280\u8853","permalink":"/docs/blog/tags/\u6280\u8853"},{"label":"docusaurus","permalink":"/docs/blog/tags/docusaurus"},{"label":"v3.1","permalink":"/docs/blog/tags/v-3-1"}],"readingTime":16.815,"hasTruncateMarker":true,"authors":[{"name":"\u5b89\u7af9 \u6d0b\u5e73","title":"\u6771\u4eac\u90fd\u5c0f\u5e73\u5e02\u8b70\u4f1a\u8b70\u54e1","url":"https://yasutakeyohei.com","email":"yohei@yasutakeyohei.com","imageURL":"https://cgit.yasutakeyohei.com/yohei.jpg","key":"yohei"}],"frontMatter":{"title":"Docusaurus\u306e\u6ce8\u610f\u66f8\u304d\u3084\u8b66\u544a\u6587\u306e\u30bf\u30a4\u30c8\u30eb\u3092\u898b\u51fa\u3057\u306b\u3057\u3066\u3001\u76ee\u6b21\u306b\u3082\u4e57\u305b\u308b\u65b9\u6cd5","description":"Docusaurus\uff08V3.1\uff09\u3067\u306f\u3001\u6ce8\u610f\u66f8\u304d\u3084\u8b66\u544a\u6587\uff08Admonition\uff09\u306f\u898b\u51fa\u3057\uff08Heading\uff09\u306b\u306f\u306a\u3089\u305a\u76ee\u6b21\u306b\u3082\u63b2\u8f09\u3055\u308c\u306a\u3044\u306e\u3067\u3001Remark/Rehype\u306e\u30d7\u30e9\u30b0\u30a4\u30f3\u3068Swizzle\u3092\u6d3b\u7528\u3057\u3066\u5b9f\u73fe\u3057\u307e\u3057\u305f\u3002","authors":"yohei","tags":["\u6280\u8853","docusaurus","v3.1"],"hide_table_of_contents":false},"unlisted":false,"nextItem":{"title":"\u65b0\u3075\u3089\u3063\u3068\u30d6\u30ed\u30b0\u7acb\u3061\u4e0a\u3052\u307e\u3057\u305f","permalink":"/docs/blog/2024/01/26/new-flat-blog"}},"content":"## Docusaurus\ud83e\udd96\\r\\n\\r\\n1\u30f5\u6708\u5f31\u4f7f\u3044\u307e\u3057\u305f\u304c\u3053\u306e[Docusaurus](https://docusaurus.io/)\uff08\u30c9\u30ad\u30e5\u30b5\u30a6\u30eb\u30b9\uff09\u306f\u6570\u3042\u308bCMS\u306e\u4e2d\u3067\u3082\u79c0\u9038\u3067\u3059\u3002\\r\\n\\r\\n\u6587\u66f8\u4f5c\u6210\u3068\u7ba1\u7406\u304c\u5bb9\u6613\u3067\u3001\u62e1\u5f35\u306e\u81ea\u7531\u5ea6\u3082\u975e\u5e38\u306b\u9ad8\u304f\u3001\u5b8c\u5168\u306a\u30aa\u30fc\u30d7\u30f3\u30bd\u30fc\u30b9\u3002\\r\\n\\r\\n\u8b70\u54e1\u6d3b\u52d5\u306b\u91cd\u8981\u306a\u300c**\u8cc7\u6599\u3092\u4f5c\u6210\u3057\u307e\u3068\u3081\u3066\u516c\u958b\u3059\u308b\u30c4\u30fc\u30eb**\u300d\u3068\u3057\u3066\u73fe\u72b6\u306e\u6700\u9069\u89e3\u3068\u611f\u3058\u307e\u3059\u3002\\r\\n\\r\\n{/* truncate */}\\r\\n\\r\\nfacebook\u304c\u6bcd\u4f53\u306a\u306e\u3067\u8272\u3005\u3068\u6c17\u306b\u306a\u308b\u3068\u3053\u308d\u3067\u3059\u304c\u3001[React](https://ja.legacy.reactjs.org/)\u3092\u521d\u3081\u3068\u3057\u3066\u6709\u76ca\u306a\u30bd\u30d5\u30c8\u30a6\u30a7\u30a2\u3092\u5b8c\u5168\u306a\u30aa\u30fc\u30d7\u30f3\u30bd\u30fc\u30b9\u3068\u3057\u3066\u63d0\u4f9b\u3057\u3066\u304f\u308c\u3066\u3044\u308b\u3053\u3068\u306f\u7d14\u7c8b\u306b\u3042\u308a\u304c\u305f\u3044\u3068\u611f\u3058\u307e\u3059\u3002\\r\\n\\r\\n## Admonition\u306e\u30bf\u30a4\u30c8\u30eb\u304c\u898b\u51fa\u3057\u306b\u306a\u3089\u306a\u3044\\r\\n\\r\\n\u3055\u3066Docusaurus\u306b\u306f[Admonition](https://docusaurus.io/docs/markdown-features/admonitions)\uff08\u6ce8\u610f\u66f8\u304d\u3084\u8b66\u544a\u6587\uff09\u3092\u5bb9\u6613\u306bmarkdown\u3067\u66f8\u304f\u65b9\u6cd5\u304c\u7528\u610f\u3055\u308c\u3066\u3044\u307e\u3059\u3002\\r\\n\\r\\n\u4f8b\u3048\u3070info\u306a\u3089\u3001\u6b21\u306e\u3088\u3046\u306bmarkdown\u3067\u66f8\u3051\u3070\u3001\\r\\n\\r\\n```mdx title=\\"Admonition\u306e\u8a18\u6cd5\uff08md\u3082\u3057\u304f\u306fmdx\u306b\u8a18\u8f09\uff09\\"\\r\\n:::info[info\u306e\u4f8b]\\r\\n\\r\\n\u3053\u3053\u306b\u6587\u7ae0\u3092\u66f8\u304f\\r\\n\\r\\n:::\\r\\n```\\r\\n\\r\\n\u6b21\u306e\u3088\u3046\u306bHTML\u3067\u8868\u793a\u3055\u308c\u307e\u3059\u3002\\r\\n\\r\\n:::info info\u306e\u4f8b\\r\\n\\r\\n\u3053\u3053\u306b\u6587\u7ae0\u3092\u66f8\u304f\\r\\n\\r\\n:::\\r\\n\\r\\n\u3057\u304b\u3057\uff08DocusaurusV3.1\uff09\u3067\u3053\u306eAdmonition\u306e\u30bf\u30a4\u30c8\u30eb\u306f\u898b\u51fa\u3057\uff08[Heading](https://docusaurus.io/docs/markdown-features/toc)\uff09\u306b\u306a\u3089\u305a\u3001\u76ee\u6b21\uff08[TOC](https://docusaurus.io/docs/markdown-features/toc)\uff09\u306b\u3082\u4e57\u308a\u307e\u305b\u3093\u3002\u4e0a\u8a18\u4f8b\u306a\u3089\u300cINFO\u306e\u4f8b\u300d\u304cTOC\u306b\u8868\u793a\u3055\u308c\u307e\u305b\u3093\u3002\\r\\n\\r\\n\\r\\n\u6b21\u306e\u56f3\u304b\u3089\u3082\u5206\u304b\u3063\u3066\u3044\u305f\u3060\u3051\u308b\u304b\u3068\u601d\u3044\u307e\u3059\u3002\\r\\n\\r\\n\\r\\n\\r\\n\u4e9b\u7d30\u306a\u3053\u3068\u306e\u3088\u3046\u306b\u3082\u601d\u3048\u307e\u3059\u304c\u3001Docusaurus\u3092\u66f8\u7c4d\u306e\u3088\u3046\u306b\u6271\u3046\u306b\u306f\u7d50\u69cb\u6c17\u306b\u306a\u308b\u3068\u3053\u308d\u3002\\r\\n\\r\\n\u306a\u304a[\u4ee5\u524d\u306fAdmonition\u306e\u30bf\u30a4\u30c8\u30eb\u306fH5\u8981\u7d20\u306b\u306a\u3063\u3066\u3044\u305f](https://github.com/elviswolcott/remark-admonitions/issues/26)\u3088\u3046\u3067\u3059\u304c\u3001\u6df1\u3055\uff08H1\uff5eH5\u306e\u30ec\u30d9\u30eb\uff09\u3092\u6c7a\u3081\u6253\u3061\u3059\u308b\u306e\u306f\u597d\u307e\u3057\u304f\u306a\u3044\u3068\u3044\u3046\u3053\u3068\u304b\u3089\uff08\uff1f\uff09\u3001\u4eca\u306fH5\u8981\u7d20\u3067\u306f\u3042\u308a\u307e\u305b\u3093\u3002\\r\\n\\r\\n\u6b21\u306e\u3088\u3046\u306b\u672c\u6587\u4e2d\u306b\u898b\u51fa\u3057\u3092\u66f8\u304f\u65b9\u6cd5\u3082\u3042\u308a\u307e\u3059\u304c\\r\\n\\r\\n```mdx title=\\"Admonition\u306e\u8a18\u6cd5\uff08md\u3082\u3057\u304f\u306fmdx\u306b\u8a18\u8f09\uff09\\"\\r\\n:::info\\r\\n\\r\\n#### \u30c6\u30b9\u30c8\\r\\n\\r\\n\uff5e\u6587\u7ae0\uff5e\\r\\n\\r\\n:::\\r\\n```\\r\\n\u898b\u305f\u76ee\u304c\u30a4\u30de\u30a4\u30c1\u306b\u306a\u308a\u307e\u3059\u3002\\r\\n\\r\\n:::info\\r\\n\\r\\n#### \u30c6\u30b9\u30c8\\r\\n\\r\\n\uff5e\u6587\u7ae0\uff5e\\r\\n\\r\\n:::\\r\\n\\r\\n\\r\\n[\u307b\u304b\u306e\u30e6\u30fc\u30b6\u30fc\u304b\u3089\u306e\u8981\u671b](https://github.com/facebook/docusaurus/discussions/7146)\u3082\u4e0a\u304c\u3063\u3066\u304a\u308a\u3001\u79c1\u3082\u5c11\u3057\u4e0d\u4fbf\u306b\u611f\u3058\u3066\u3044\u305f\u306e\u3067\u3001\u6b21\u306e\u4ed5\u69d8\u306b\u306a\u308b\u3088\u3046\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3057\u307e\u3057\u305f\u306e\u3067\u305d\u306e\u65b9\u6cd5\u3092\u89e3\u8aac\u3057\u307e\u3059\u3002\\r\\n\\r\\n## \u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u5f8c\u306f\u3069\u3046\u306a\u308b\u304b\\r\\n\\r\\n\u5f8c\u8ff0\u306e\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3092\u3059\u308b\u3068\u3001Admonition\u306e\u30bf\u30a4\u30c8\u30eb\u90e8\u306b\uff08\u901a\u5e38\u306e\u898b\u51fa\u3057markdown\u3068\u540c\u69d8\u306b\uff09**#\u3092\u5192\u982d\u306b2\u500b\u4ee5\u4e0a\u5165\u308c\u308b** \u3053\u3068\u3067\u898b\u51fa\u3057\u306b\u306a\u308a\u307e\u3059\u3002\u307e\u305fTOC\u306b\u3082\u53cd\u6620\u3055\u308c\u307e\u3059\u3002#\u30922\u500b\u4ee5\u4e0a\u3068\u3057\u3066\u3044\u308b\u306e\u306f\u3001H1\u3092Admonition\u306b\u306f\u4f7f\u308f\u306a\u3044\u306f\u305a\u306e\u305f\u3081\u3002\u307e\u305f#\u3092\u5165\u308c\u306a\u3044\u5834\u5408\u306f\u898b\u51fa\u3057\u306b\u306a\u3089\u305a\u3001TOC\u306b\u3082\u53cd\u6620\u3055\u308c\u307e\u305b\u3093\u3002\\r\\n\\r\\n### \u30bf\u30a4\u30c8\u30eb\u5192\u982d\u306b#\u3092\u5165\u308c\u305f\u5834\u5408\\r\\n\\r\\n```mdx title=\\"Admonition\u306e\u8a18\u6cd5\uff08md\u3082\u3057\u304f\u306fmdx\u306b\u8a18\u8f09\uff09\\"\\r\\n:::info[#### \u898b\u51fa\u3057\u306b\u306a\u308aTOC\u306b\u53cd\u6620\u3055\u308c\u308b\u30bf\u30a4\u30c8\u30eb\u306e\u4f8b]\\r\\n\\r\\n#\u304c4\u3064\u5206\u306e\u305f\u3081H4\u898b\u51fa\u3057\u306b\u306a\u308a\u307e\u3059\u3002TOC\u306b\u3082\u53cd\u6620\u3055\u308c\u307e\u3059\u3002\\r\\n\\r\\n:::\\r\\n```\\r\\n\u2193\\r\\n\\r\\n:::info #### \u898b\u51fa\u3057\u306b\u306a\u308aTOC\u306b\u53cd\u6620\u3055\u308c\u308b\u30bf\u30a4\u30c8\u30eb\u306e\u4f8b\\r\\n\\r\\n#\u304c4\u3064\u5206\u306e\u305f\u3081H4\u898b\u51fa\u3057\u306b\u306a\u308a\u307e\u3059\u3002TOC\u306b\u3082\u53cd\u6620\u3055\u308c\u307e\u3059\u3002\\r\\n\\r\\n:::\\r\\n\\r\\n\u3053\u306e\u30d6\u30ed\u30b0\u3067\u3082TOC\u306b\u8868\u793a\u3055\u308c\u3066\u3044\u307e\u3059\u3002 \\r\\n\u306a\u304a\u30de\u30a6\u30b9\u30ab\u30fc\u30bd\u30eb\u3092\u4e57\u305b\u305f\u969b\u306b\u30cf\u30c3\u30b7\u30e5\u30ea\u30f3\u30af\uff08#\uff09\u304c\u8868\u793a\u3055\u308c\u308b\u3088\u3046\u306b\u3059\u308b\u306b\u306fCSS\u306e\u8a2d\u5b9a\u304c\u5fc5\u8981\u3067\u3059\u3002\\r\\n\\r\\n### \u30bf\u30a4\u30c8\u30eb\u5192\u982d\u306b#\u3092\u5165\u308c\u306a\u3044\u5834\u5408\\r\\n\\r\\n```mdx title=\\"Admonition\u306e\u8a18\u6cd5\uff08md\u3082\u3057\u304f\u306fmdx\u306b\u8a18\u8f09\uff09\\"\\r\\n:::info \u898b\u51fa\u3057\u306b\u306a\u3089\u305aTOC\u306b\u53cd\u6620\u3055\u308c\u306a\u3044\u30bf\u30a4\u30c8\u30eb\u306e\u4f8b\\r\\n\\r\\n#\u304c\u306a\u3044\u305f\u3081\u898b\u51fa\u3057\u306b\u306a\u3089\u305a\u3001TOC\u306b\u3082\u53cd\u6620\u3055\u308c\u307e\u305b\u3093\u3002\\r\\n\\r\\n:::\\r\\n```\\r\\n\u2193\\r\\n:::info #### \u898b\u51fa\u3057\u306b\u306a\u3089\u305aTOC\u306b\u53cd\u6620\u3055\u308c\u306a\u3044\u30bf\u30a4\u30c8\u30eb\u306e\u4f8b\\r\\n\\r\\n#\u304c\u306a\u3044\u305f\u3081\u898b\u51fa\u3057\u306b\u306a\u308a\u307e\u305b\u3093\u3002\\r\\n\\r\\n:::\\r\\n\\r\\n### \u30bf\u30a4\u30c8\u30eb\u306bHTML\u3092\u5165\u308c\u308b\u3053\u3068\u3082\u53ef\u80fd\\r\\n\\r\\n\u306a\u304a\u30bf\u30a4\u30c8\u30eb\u90e8\u306bHTML\u3092\u5165\u308c\u308b\u3053\u3068\u3082\u3067\u304d\u307e\u3059\u3002TOC\u306b\u3082\u53cd\u6620\u3055\u308c\u307e\u3059\u3002\\r\\n\\r\\n:::info #### \u30c6\u30b9\u30c8<sup>123</sup>\u30c6\u30b9\u30c8<u>\u4e0b\u7dda</u>\\r\\n\\r\\n```\\r\\n\\r\\n\u30bf\u30a4\u30c8\u30eb\u90e8\u306emarkdown\u306f\u6b21\u306e\u901a\u308a\u3067\u3059\u3002\\r\\n\\r\\n#### \u30c6\u30b9\u30c8<sup>123</sup>\u30c6\u30b9\u30c8<u>\u4e0b\u7dda</u>\\r\\n\\r\\n```\\r\\n\\r\\n:::\\r\\n\\r\\n\\r\\n## \u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u306b\u5229\u7528\u3057\u305f\u6a5f\u80fd\\r\\n\\r\\n\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u306f\u6b21\u306e\u6a5f\u80fd\u3092\u6d3b\u7528\u3057\u307e\u3057\u305f\u3002\\r\\n\\r\\n- [Remark/Rehype\u306e\u30d7\u30e9\u30b0\u30a4\u30f3](https://docusaurus.io/docs/markdown-features/plugins)\\r\\n- [Swizzling](https://docusaurus.io/docs/swizzling)\\r\\n\\r\\n### Remark\u3068Rehype\u306b\u3064\u3044\u3066\\r\\n\\r\\nRemark\u3068Rehype\u306f\u3001markdown\u3092HTML\u306b\u5909\u63db\u3059\u308b\u30d7\u30ed\u30bb\u30b9\u306b\u304a\u3044\u3066\u3001AST\uff08\u62bd\u8c61\u69cb\u6587\u6728\u30fbAbstract Syntax Tree\uff09\u306b\u4f5c\u7528\u3059\u308b\u30d7\u30e9\u30b0\u30a4\u30f3\u3067\u3059\u3002\u306a\u304a[AST\u3092\u64cd\u4f5c\u3059\u308b\u30aa\u30fc\u30d7\u30f3\u30bd\u30fc\u30b9\u306e\u30a8\u30b3\u30b7\u30b9\u30c6\u30e0](https://github.com/unifiedjs/unified)\u306e\u4e2d\u306b\u306f\u3082\u3046\u4e00\u3064[Retext](https://github.com/retextjs/retext)\u3068\u3044\u3046\u30d7\u30e9\u30b0\u30a4\u30f3\u3082\u3042\u308a\u307e\u3059\u304c\u3001Docusaurus\u306b\u306f\u5b9f\u88c5\u3055\u308c\u3066\u3044\u306a\u3044\u3088\u3046\u3067\u3059\u3002\\r\\n\\r\\n```md title=\\"markdown\u304b\u3089HTML\u3078\u5909\u63db\u51e6\u7406\u306e\u6d41\u308c\\"\\r\\n| ........................ process ........................... |\\r\\n| .......... parse ... | ... run ... | ... stringify ..........|\\r\\n\\r\\n +--------+ +----------+\\r\\nInput ->- | Parser | ->- Syntax Tree ->- | Compiler | ->- Output\\r\\n +--------+ | +----------+\\r\\n X\\r\\n |\\r\\n +--------------+\\r\\n | Transformers |\\r\\n +--------------+\\r\\n```\\r\\n\\r\\n\u4e0a\u56f3\uff08[Unified Overview\u3088\u308a](https://github.com/unifiedjs/unified?tab=readme-ov-file#overview)\uff09\u306bTransformers\u3068\u3042\u308b\u3068\u3053\u308d\u304cRemark/Rehype\u306e\u52d5\u4f5c\u3059\u308b\u3068\u3053\u308d\u3002\\r\\n\\r\\nRemark\u306fmarkdown\u5f62\u5f0f\u3067\u3001Rehype\u306fHTML\u5f62\u5f0f\u3067AST\u3092\u6271\u3044\u307e\u3059\u3002\u3069\u3061\u3089\u3082\u540c\u3058\u3088\u3046\u306bAST\u3092\u64cd\u4f5c\u3067\u304d\u307e\u3059\u304c\u3001\u30c7\u30fc\u30bf\u69cb\u9020\u304c\u9055\u3046\u305f\u3081\u3001\u76ee\u7684\u306b\u5fdc\u3058\u3066\u9078\u629e\u3059\u308b\u3053\u3068\u306b\u306a\u308b\u306e\u304b\u306a\u3068\u601d\u3044\u307e\u3059\u3002\\r\\n\\r\\n[\u3053\u3061\u3089\u306e\u30b5\u30a4\u30c8](https://vivliostyle.github.io/vivliostyle_doc/ja/vivliostyle-user-group-vol2/spring-raining/index.html)\u306a\u3069\u304c\u8a73\u3057\u3044\u3067\u3059\u3002\\r\\n\\r\\n#### Docusaurus\u306b\u304a\u3051\u308b\u30d7\u30e9\u30b0\u30a4\u30f3\u306e\u5b9f\u884c\u30bf\u30a4\u30df\u30f3\u30b0\\r\\n\\r\\nDocusaurus\u3067\u3053\u308c\u3089\u306e\u30d7\u30e9\u30b0\u30a4\u30f3\u3092\u5229\u7528\u3059\u308b\u305f\u3081\u306b\u306fdocusaurus.config.json\u306b\u8a2d\u5b9a\u304c\u5fc5\u8981\u3067\u3059\u3002[\u3053\u306e\u30da\u30fc\u30b8\u306b\u3088\u308b\u3068](https://docusaurus.io/docs/markdown-features/plugins)\u6b21\u306e4\u7a2e\u985e\u306e\u8a2d\u5b9a\u5024\u306b\u3066\u30d7\u30e9\u30b0\u30a4\u30f3\u3092\u767b\u9332\u3067\u304d\u307e\u3059\u3002\\r\\n\\r\\n| | \u30c7\u30d5\u30a9\u30eb\u30c8\u30d7\u30e9\u30b0\u30a4\u30f3\u9069\u7528\u524d | \u30c7\u30d5\u30a9\u30eb\u30c8\u30d7\u30e9\u30b0\u30a4\u30f3\u9069\u7528\u5f8c |\\r\\n| -------------------- | --------------------------- | --------------------------- |\\r\\n| Remark<br />Markdown\u5f62\u5f0f | beforeDefaultRemarkPlugins | remarkPlugins |\\r\\n| Rehype<br />HTML\u5f62\u5f0f | beforeDefaultRehypePlugins | rehypePlugins |\\r\\n\\r\\nmarkdown\u304b\u3089HTML\u3078\u306e\u5909\u63db\u51e6\u7406\u306e\u3068\u3053\u308d\u3067\u3001Docusaurus\u306f\u81ea\u524d\u306e\u30d7\u30e9\u30b0\u30a4\u30f3\uff08\u30c7\u30d5\u30a9\u30eb\u30c8\u30d7\u30e9\u30b0\u30a4\u30f3\uff09\u3092\u4f7f\u3044\u300c\u898b\u51fa\u3057\u306bid\u3092\u3064\u3051\u308b\u300d\u300cAST\u304b\u3089TOC\u3092\u4f5c\u6210\u3059\u308b\u300d\u306a\u3069\u306e\u51e6\u7406\u3092\u884c\u3063\u3066\u3044\u307e\u3059\u3002\u305d\u306e\u305f\u3081\u4eca\u56de\u306e\u3088\u3046\u306b\u300cAmonition\u306e\u30bf\u30a4\u30c8\u30eb\u3092\u8aad\u3093\u3067TOC\u306b\u53cd\u6620\u3059\u308b\u300d\u305f\u3081\u306b\u306f\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u30d7\u30e9\u30b0\u30a4\u30f3\u9069\u7528\u524d\u3068\u9069\u7528\u5f8c\u306e\u4e21\u65b9\u306e\u30bf\u30a4\u30df\u30f3\u30b0\u3067\u306e\u51e6\u7406\u304c\u5fc5\u8981\u306b\u306a\u308a\u307e\u3059\u3002\\r\\n\\r\\n\\r\\n### Swizzling\u306b\u3064\u3044\u3066\\r\\n\\r\\nSwizzling\u306f[\u3053\u3061\u3089](https://docusaurus.io/docs/swizzling)\u306b\u8aac\u660e\u304c\u3042\u308b\u901a\u308a\u306e\u6a5f\u80fd\u3067\u3001\u7c21\u5358\u306b\u8a00\u3046\u3068React\u306e\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3067\u304d\u308b\u6a5f\u80fd\u3067\u3059\u3002\\r\\n\\r\\nSwizzling\u306e\u8a2d\u5b9a\u3092\u3059\u308b\u3068\u3001Docusaurus\u304c\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u4ee3\u308f\u308a\u306b\u81ea\u52d5\u7684\u306b\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3057\u305f\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u4f7f\u7528\u3059\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002\\r\\n\\r\\n\u4eca\u56de\u306f\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u306eAdmonition\u306b\u306a\u3044ID\u5c5e\u6027\u3092\u6301\u305f\u305b\u308b\u305f\u3081Admonition\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3057\u307e\u3057\u305f\u3002Swizzling\u306e\u8a2d\u5b9a\u3092\u3059\u308b\u3053\u3068\u306b\u3088\u308a\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u306eAdmonition\u306e\u4ee3\u308f\u308a\u306b\u3053\u306e\u30ab\u30b9\u30bf\u30e0\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u304c\u4f7f\u308f\u308c\u308b\u3088\u3046\u306b\u3057\u307e\u3059\u3002\\r\\n\\r\\n## \u52d5\u4f5c\u539f\u7406\\r\\n\\r\\nTOC\u306f\u300cAST\u306b\u542b\u307e\u308c\u3066\u3044\u308bheading\u8981\u7d20\u3092\u5358\u7d14\u306b\u914d\u5217\u306b\u5165\u308c\u3066\u3044\u308b\u300d\u3060\u3051\u3067\u3059\u304c\u3001\u3053\u306e\u51e6\u7406\u306f\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3067\u4e0a\u66f8\u304d\u3067\u304d\u307e\u305b\u3093\u3002\u305d\u3053\u3067\u3001\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3067\u304d\u308b\u51e6\u7406\u3060\u3051\u3067Admonition\u306e\u30bf\u30a4\u30c8\u30eb\u3092TOC\u306b\u53cd\u6620\u3059\u308b\u65b9\u6cd5\u3068\u3057\u3066\u6b21\u3092\u601d\u3044\u3064\u304d\u3001\u5b9f\u88c5\u3057\u307e\u3057\u305f\u3002\\r\\n\\r\\n1. docusaurus\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u30d7\u30e9\u30b0\u30a4\u30f3\u304cTOC\u306e\u51e6\u7406\u3092\u884c\u3046\u3088\u308a\u524d\u306b\u3001Admonition\u306e\u30bf\u30a4\u30c8\u30eb\u90e8\u3092\u898b\u51fa\u3057\u3068\u3057\u3066\u65b0\u898f\u4f5c\u6210\u3057\u3001Admonition\u8981\u7d20\u306e\u76f4\u524d\u306b\u8ffd\u52a0\u3059\u308b\\r\\n1. docusaurus\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u30d7\u30e9\u30b0\u30a4\u30f3\u304cTOC\u306e\u51e6\u7406\u3092\u884c\u3044\u3001Admonition\u306e\u30bf\u30a4\u30c8\u30eb\u90e8\u304cTOC\u306b\u5165\u308b\u3002\u898b\u51fa\u3057\u306b\u306fid\u304c\u4ed8\u4e0e\u3055\u308c\u308b\\r\\n1. \u30c7\u30d5\u30a9\u30eb\u30c8\u30d7\u30e9\u30b0\u30a4\u30f3\u306e\u51e6\u7406\u304c\u7d42\u4e86\u3057\u305f\u3089\u4f5c\u6210\u3057\u305f\u898b\u51fa\u3057\u306f\u4e0d\u8981\u306b\u306a\u308b\u306e\u3067\u524a\u9664\u3059\u308b\u3002\u305d\u306e\u969b\u3001\u524a\u9664\u3059\u308b\u898b\u51fa\u3057\u3068\u540c\u3058\u30bf\u30a4\u30c8\u30eb\u3092\u6301\u3064Admonition\u8981\u7d20\u3092\u63a2\u3057\u3001id\u3092\u4e0e\u3048\u308b\\r\\n1. Admonition\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3067id\u3092HTML\u30bf\u30b0\u306b\u4ed8\u4e0e\u3059\u308b\\r\\n\\r\\n\\r\\n\\r\\n## \u5b9f\u88c5\\r\\n\\r\\n### docusaurus.config.json\\r\\n\\r\\n\u307e\u305adocusaurus.config.json\u306bimport\u3068plugin\u8a2d\u5b9a\u3092\u8a18\u5165\u3057\u307e\u3059\uff08\u30cf\u30a4\u30e9\u30a4\u30c8\u90e8\uff09\u3002\\r\\n\\r\\n\u3053\u308c\u3067Docusaurus\u30c7\u30d5\u30a9\u30eb\u30c8\u30d7\u30e9\u30b0\u30a4\u30f3\u9069\u7528\u306e\u524d\u5f8c\u306b\u305d\u308c\u305e\u308c\u81ea\u4f5c\u306eRemark/Rehype\u30d7\u30e9\u30b0\u30a4\u30f3\u304c\u5b9f\u884c\u3055\u308c\u308b\u3053\u3068\u306b\u306a\u308a\u307e\u3059\u3002\\r\\n\\r\\nblog\u306a\u3069\u3092\u5165\u308c\u3066\u3044\u308b\u5834\u5408\u306f\u3001\u305d\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u306b\u3082\u8a18\u8f09\u3057\u307e\u3059\u3002\\r\\n\\r\\n```js title=\\"docusaurus.config.json\\"\\r\\n// highlight-start\\r\\nimport admonitionTitleToHeadingBeforeTOC from \'./src/remark/admonition-title-to-heading-before-toc.js\';\\r\\nimport admonitionTitleToHeadingAfterTOC from \'./src/rehype/admonition-title-to-heading-after-toc.js\';\\r\\n// highlight-end\\r\\n\\r\\nexport default {\\r\\n // ...\\r\\n presets: [\\r\\n [\\r\\n \'classic\',\\r\\n /** @type {import(\'@docusaurus/preset-classic\').Options} */\\r\\n ({\\r\\n docs: {\\r\\n // ...\\r\\n // highlight-start\\r\\n beforeDefaultRemarkPlugins: [admonitionTitleToHeadingBeforeTOC],\\r\\n rehypePlugins: [admonitionTitleToHeadingAfterTOC],\\r\\n // highlight-end\\r\\n },\\r\\n blog: {\\r\\n // ...\\r\\n // highlight-start\\r\\n beforeDefaultRemarkPlugins: [admonitionTitleToHeadingBeforeTOC],\\r\\n rehypePlugins: [admonitionTitleToHeadingAfterTOC],\\r\\n // highlight-end\\r\\n },\\r\\n // ...\\r\\n }),\\r\\n ]],\\r\\n // ...\\r\\n}\\r\\n```\\r\\n\\r\\n### Remark/Rehype\u30d7\u30e9\u30b0\u30a4\u30f3\\r\\n\\r\\n\u6b21\u306b\u30d7\u30e9\u30b0\u30a4\u30f3\u3092\u5b9f\u88c5\u3057\u307e\u3059\u3002\\r\\n\\r\\ndocusaurus\u306esrc\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u4e0b\u306brehype\u3068remark\u3068\u3044\u3046\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u4f5c\u308a\u3001\u6b21\u306e\u30d5\u30a1\u30a4\u30eb\u540d\u3068\u5185\u5bb9\u30672\u3064\u306e\u30d7\u30e9\u30b0\u30a4\u30f3\u3092\u4f5c\u308a\u307e\u3059\u3002\\r\\n\\r\\n```js title=\\"src/rehype/admonition-title-to-heading-before-toc.js\\"\\r\\nimport {visit} from \'unist-util-visit\';\\r\\n\\r\\nconst plugin = (options) => {\\r\\n const transformer = async (ast) => {\\r\\n let newBeginningText = \\"\\";\\r\\n const visitor = ((node, index, parent) => {\\r\\n if (node.type === \'containerDirective\') {\\r\\n // :::info\u306a\u3069\u306b\u7d9a\u304f\u30bf\u30a4\u30c8\u30eb\u5192\u982dText\u90e8\uff08\u5192\u982d#\u3092\u542b\u3080\uff08\u3082\u3057\u304f\u306f\u542b\u307e\u306a\u3044\uff09\u90e8\u5206\uff09\u3092\u53d6\u5f97\uff08:::info ##** \uff09\\r\\n // \uff08\u30bf\u30a4\u30c8\u30eb\u5168\u4f53\u306b\u306fHTML\u7b49\u304c\u542b\u307e\u308c\u308b\u53ef\u80fd\u6027\u304c\u3042\u308b\u305f\u3081\u5192\u982dText\u90e8\u3060\u3051\u64cd\u4f5c\u3059\u308b\u3001\u6b8b\u308a\u306f\u30b7\u30e3\u30ed\u2015\u30b3\u30d4\u30fc\uff09\\r\\n const beginningText = node.children[0].children[0].value;\\r\\n\\r\\n // \u30bf\u30a4\u30c8\u30eb\u5192\u982dText\u90e8\u306b#\u304c2\u3064\u4ee5\u4e0a\u9023\u7d9a\u3057\u3066\u3044\u308b\u3068\u304d\\r\\n if(/^##/.test(beginningText)) {\\r\\n // \u30bf\u30a4\u30c8\u30eb\u5192\u982d\u90e8\u304b\u3089#\u3068\u305d\u308c\u306b\u7d9a\u304f\u7a7a\u767d\u3092\u524a\u9664\\r\\n newBeginningText = beginningText.replace(/^#+/, \'\').trim();\\r\\n\\r\\n // \u30bf\u30a4\u30c8\u30eb\u90e8\u5192\u982d\u3060\u3051\u66f4\u65b0\u3057\u3001\u6b8b\u308a\u306f\u30b7\u30e3\u30ed\u2015\u30b3\u30d4\u30fc\\r\\n // \u307e\u305a\u30bf\u30a4\u30c8\u30eb\u90e8\u5168\u4f53\u3092\u30b7\u30e3\u30ed\u2015\u30b3\u30d4\u30fc\\r\\n let titleNodes = [...node.children[0].children];\\r\\n\\r\\n // \u5192\u982d\u8981\u7d20\u306evalue\u3092\u66f4\u65b0\uff08\u307b\u304b\u306f\u30b7\u30e3\u30ed\u2015\u30b3\u30d4\u30fc\uff09\\r\\n const newTitleBeginningNode = {\\r\\n ...titleNodes[0],\\r\\n value: newBeginningText,\\r\\n }\\r\\n \\r\\n // \u30bf\u30a4\u30c8\u30eb\u30ce\u30fc\u30c9\u306e\u5192\u982d\u8981\u7d20\u3060\u3051\u66f4\u65b0\uff08\u307b\u304b\u306f\u30b7\u30e3\u30ed\u2015\u30b3\u30d4\u30fc\uff09\\r\\n const newTitleNodes = [ ...titleNodes ];\\r\\n newTitleNodes[0] = newTitleBeginningNode;\\r\\n\\r\\n // visit\u3057\u3066\u3044\u308bcontainerDirective\u306e\u524d\u306bheading\u30ce\u30fc\u30c9\u3092\u8ffd\u52a0\\r\\n parent.children.splice(index, 0, {\\r\\n type: \'heading\',\\r\\n depth: (beginningText.match(/^##+/) || [\'\'])[0].length, // #\u306e\u9023\u7d9a\u6570\u304cheading\u306e\u6df1\u3055\\r\\n children: newTitleNodes,\\r\\n });\\r\\n // \u6b21\u306b\u691c\u7d22\u3059\u308b\u306e\u306findex\u30922\u3064\u5206\u98db\u3070\u3057\u305f\u30ce\u30fc\u30c9\\r\\n return index + 2;\\r\\n }\\r\\n }\\r\\n });\\r\\n \\r\\n visit(ast, \'containerDirective\', visitor);\\r\\n \\r\\n };\\r\\n return transformer;\\r\\n};\\r\\n\\r\\nexport default plugin;\\r\\n```\\r\\n\\r\\n```js title=\\"src/rehype/admonition-title-to-heading-after-toc.js\\"\\r\\nimport {visit} from \'unist-util-visit\';\\r\\n\\r\\nconst plugin = (options) => {\\r\\n const transformer = async (ast) => {\\r\\n let hId = null;\\r\\n let hContent = null;\\r\\n visit(ast, \'element\', (node, index, parent) => {\\r\\n if (/^h[2-6]$/.test(node.tagName) && node.properties && node.properties.id) {\\r\\n // H\u8981\u7d20\uff08h2~h6\uff09\u3092\u898b\u3064\u3051\u305f\u5834\u5408\\r\\n \\r\\n // ID\u3068\u30bf\u30a4\u30c8\u30eb\u306e\u5192\u982dText\u90e8\u3092\u53d6\u5f97\u3059\u308b\\r\\n hId = node.properties.id;\\r\\n hContent = node.children ? node.children[0].value :\\r\\n node.children[0].children[0] ? node.children[0].children[0].value : \'\';\\r\\n\\r\\n // \u7d9a\u304fAdmonition\u3092\u63a2\u3059\uff08doc\u306fH\u8981\u7d20\u3068admonition\u304c\u9023\u7d9a\u3057\u3066\u3044\u308b\u304c\\r\\n // blog\u3067\u306f\u306a\u305c\u304b\u6539\u884c\u8981\u7d20{ type:\'text\', value:\'\\\\n\' }\u304c\u9593\u306b\u5165\u3063\u3066\u3044\u308b\u306e\u3067\u5ff5\u306e\u305f\u3081\u96a3\u63a53\u8981\u7d20\u3092\u63a2\u3059\\r\\n for (let i = index + 1; i < index + 4 && i < parent.children.length; i++) {\\r\\n if(parent.children[i] && parent.children[i].tagName === \'admonition\') {\\r\\n // admonition\uff08div\uff09\u3092\u898b\u3064\u3051\u305f\u5834\u5408\\r\\n const admonitionNode = parent.children[i];\\r\\n \\r\\n // admonition\u30bf\u30a4\u30c8\u30eb\u306e\u5192\u982dText\u90e8\u5206\u3092\u53d6\u5f97\uff08properties.title\u3082\u3057\u304f\u306fchildren[0].children[0].value\uff09\\r\\n const admonitionNodeTitle = admonitionNode.properties.title ? admonitionNode.properties.title :\\r\\n admonitionNode.children[0] && admonitionNode.children[0].children[0] ? admonitionNode.children[0].children[0].value : \'\';\\r\\n\\r\\n if(/^##/.test(admonitionNodeTitle) && admonitionNodeTitle.replace(/^#+/, \'\').trim() === hContent.trim()) {\\r\\n // #\u3067\u59cb\u307e\u3063\u3066\u3044\u3066\u3001\u30bf\u30a4\u30c8\u30eb\u5192\u982d\u90e8\u304c\u540c\u3058\u5834\u5408\\r\\n // div\u306eid\u3092H\u30bf\u30b0\u306eid\u306b\u8a2d\u5b9a\\r\\n admonitionNode.properties.id = hId;\\r\\n // H\u8981\u7d20\u3092\u524a\u9664\\r\\n parent.children.splice(index, 1);\\r\\n }\\r\\n }\\r\\n }\\r\\n }\\r\\n });\\r\\n };\\r\\n return transformer;\\r\\n};\\r\\n\\r\\nexport default plugin;\\r\\n```\\r\\n\\r\\n:::note Admonition\u306e\u30c4\u30ea\u30fc\u69cb\u9020\\r\\n\\r\\n\u53c2\u8003\u307e\u3067\u306b\u3001Remark\u306e\u30d7\u30e9\u30b0\u30a4\u30f3\u304b\u3089\u898b\u308b\u3068Admonition\u306eAST\u306f\u4f8b\u3048\u3070\u6b21\u306e\u3088\u3046\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u3002\\r\\n\\r\\n```javascript title=\\"Admonition\u306e\u30c4\u30ea\u30fc\u69cb\u9020\uff08\u4e00\u4f8b\uff09\\"\\r\\n{\\r\\n type: \'containerDirective\',\\r\\n name: \'info\',\\r\\n attributes: {},\\r\\n children: [\\r\\n {\\r\\n type: \'paragraph\',\\r\\n data: { directiveLabel: true },\\r\\n children: [\\r\\n {\\r\\n type: \'text\',\\r\\n value: \'#### info title \u3082\u3057HTML\u7b49\u304c\u5165\u308b\u3068\uff08\u3053\u3053\u306ba\u30bf\u30b0\u3092\u5165\u308c\u308b\u3068\uff09\',\\r\\n position: [Object]\\r\\n },\\r\\n {\\r\\n type: \'mdxJsxTextElement\',\\r\\n name: \'a\',\\r\\n attributes: [],\\r\\n position: [Object],\\r\\n data: [Object],\\r\\n children: [Array]\\r\\n },\\r\\n { type: \'text\', value: \'\u3053\u306e\u3088\u3046\u306b\u30bf\u30a4\u30c8\u30eb\u90e8\u304c\u5225\u3005\u306e\u8981\u7d20\u3068\u3057\u3066\u914d\u5217\u306b\u5165\u3063\u3066\u3044\u308b\u3002\', position: [Object] }\\r\\n ],\\r\\n position: {\\r\\n start: { line: 1347, column: 8, offset: 34053 },\\r\\n end: { line: 1347, column: 55, offset: 34100 }\\r\\n }\\r\\n },\\r\\n { type: \'paragraph\', children: [Array], position: [Object] },\\r\\n ...\\r\\n ],\\r\\n ...\\r\\n}\\r\\n```\\r\\n:::\\r\\n\\r\\n### Swizzling\\r\\n\\r\\n\u6b21\u306bSwizzling\u3067\u3059\u3002\\r\\n\\r\\nDocusaurus\u306esrc/theme\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306bAdmonition\u3068\u3044\u3046\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u4f5c\u308a\u3001\u6b21\u306e\u4e00\u4f8b\u306e\u30d5\u30a1\u30a4\u30eb\u3092\u683c\u7d0d\u3057\u307e\u3059\u3002\\r\\n\\r\\n\u306a\u304a[\u3053\u3053\u306b\u8aac\u660e\u304c\u3042\u308b\u901a\u308a](https://docusaurus.io/docs/swizzling#ejecting)Swizzling\u306b\u306fEjecting\u3068Wrapping\u306e\u65b9\u6cd5\u304c\u3042\u308a\u307e\u3059\u3002\\r\\n\\r\\nWrapping\u3067\u306fAdmonition\u306e\u5185\u90e8\u307e\u3067\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3067\u304d\u306a\u3044\u305f\u3081\u300c\u30bf\u30a4\u30c8\u30eb\u90e8\u5206\u306bid\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u4ed8\u3051\u308b\u300d\u3068\u3044\u3063\u305f\u3053\u3068\u304c\u3067\u304d\u307e\u305b\u3093\u3002\u305d\u306e\u305f\u3081Ejecting\u3092\u4f7f\u3044\u307e\u3059\u3002\\r\\n\\r\\n:::note\\r\\n\\r\\nEjecting\u3092\u4f7f\u3046\u5834\u5408\u306f\u30d0\u30fc\u30b8\u30e7\u30f3\u30a2\u30c3\u30d7\u306b\u3088\u3063\u3066\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3068\u6319\u52d5\u304c\u5909\u308f\u3063\u3066\u304f\u308b\u53ef\u80fd\u6027\u304c\u3042\u308b\u306e\u3067\u30a2\u30c3\u30d7\u30b0\u30ec\u30fc\u30c9\u306e\u969b\u306f\u6ce8\u610f\u304c\u5fc5\u8981\u3067\u3059\u3002\\r\\n\\r\\n:::\\r\\n\\r\\n#### Ejecting\\r\\n\\r\\n```bash\\r\\nnpm run swizzle @docusaurus/theme-classic Admonition -- --eject\\r\\n```\\r\\n\\r\\nDocusaurus V3.1\u3067\u306f\u6b21\u306e\u3088\u3046\u306a\u30e1\u30c3\u30bb\u30fc\u30b8\u304c\u51fa\u307e\u3059\u306e\u3067\u3001YES\u3092\u9078\u3073\u307e\u3059\u3002\\r\\n```bash\\r\\n? Do you really want to swizzle this unsafe internal component? \xbb - Use arrow-keys. Return to submit.\\r\\n NO: cancel and stay safe\\r\\n> YES: I know what I am doing!\\r\\n```\\r\\n\\r\\nEjecting\u3092\u3059\u308b\u3068\u3001\u5b9f\u8cea\u7684\u306bnode_modules\u306e@docusaurus/theme-classic/lib/theme\u306b\u3042\u308b\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u304csrc/theme\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u30b3\u30d4\u30fc\u3055\u308c\u307e\u3059\u3002\\r\\n\\r\\n\u3042\u3068\u306f\u30b3\u30d4\u30fc\u3055\u308c\u305f\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u3044\u3058\u308b\u3060\u3051\u3067\u3059\u3002\\r\\n\\r\\n#### \u30b3\u30fc\u30c9\u306e\u5909\u66f4\\r\\n\\r\\nLayout\u30d5\u30a1\u30a4\u30eb\u3092\u6b21\u306e\u3088\u3046\u306b\u5909\u66f4\u3059\u308b\u306e\u307f\u3067\u3059\u3002\\r\\n\\r\\n```js title=\\"src/theme/Admonition/Layout/index.js\\"\\r\\nimport React from \'react\';\\r\\nimport clsx from \'clsx\';\\r\\nimport {ThemeClassNames} from \'@docusaurus/theme-common\';\\r\\nimport styles from \'./styles.module.css\';\\r\\n// highlight-next-line\\r\\nimport headingStyles from \'@docusaurus/theme-classic/lib/theme/Heading/styles.module.css\';\\r\\n\\r\\nfunction AdmonitionContainer({type, className, children}) {\\r\\n return (\\r\\n <div\\r\\n className={clsx(\\r\\n ThemeClassNames.common.admonition,\\r\\n ThemeClassNames.common.admonitionType(type),\\r\\n styles.admonition,\\r\\n className,\\r\\n )}>\\r\\n {children}\\r\\n </div>\\r\\n );\\r\\n}\\r\\n// highlight-start\\r\\nfunction AdmonitionHeading({icon, title, id}) {\\r\\n let depth = 0;\\r\\n let trimmedTitle = title;\\r\\n // title\u306bHTML\u7b49\u304c\u542b\u307e\u308c\u3066\u3044\u308b\u5834\u5408\u306f\u6587\u5b57\u5217\u3067\u306f\u306a\u304f\u914d\u5217\u306b\u306a\u308b\\r\\n if(typeof title === \\"string\\") {\\r\\n // \u6587\u5b57\u5217\u5192\u982d\u306e#\u306e\u6570\u3092\u6570\u3048\u308b\uff08\\r\\n depth = title.match ? (title.toString().match(/^#+/) || [\'\'])[0].length : 0;\\r\\n // #\u3092\u7701\u3044\u305f\u30bf\u30a4\u30c8\u30eb\u3092\u5f97\u308b\\r\\n trimmedTitle = depth > 0 ? title.replace(/^#+/, \'\').trim() : title;\\r\\n } else if (typeof title[0] === \\"string\\") {\\r\\n depth = title[0].match ? (title[0].match(/^#+/) || [\'\'])[0].length : 0;\\r\\n trimmedTitle = depth > 0 ? [title[0].replace(/^#+/, \'\').trim(), ...title.slice(1)] : title;\\r\\n }\\r\\n\\r\\n // \u30b9\u30af\u30ed\u30fc\u30eb\u4f4d\u7f6e\u8abf\u6574\u306ecss\\r\\n const classNames = clsx(\\"anchor\\", \\"title\\", headingStyles.anchorWithStickyNavbar);\\r\\n // depth\u306b\u5fdc\u3058\u3066\u898b\u51fa\u3057\u30bf\u30b0\u3092\u30ec\u30f3\u30c0\u30fc\\r\\n return (\\r\\n <div className={styles.admonitionHeading}>\\r\\n <span className={styles.admonitionIcon}>{icon}</span>\\r\\n {(() => {\\r\\n if (depth == 3) {\\r\\n return(\\r\\n <h3\\r\\n id={id}\\r\\n className={classNames}\\r\\n >\\r\\n {trimmedTitle}\\r\\n </h3>\\r\\n )\\r\\n } else if (depth == 4) {\\r\\n return(\\r\\n <h4\\r\\n id={id}\\r\\n className={classNames}\\r\\n >\\r\\n {trimmedTitle}\\r\\n </h4>\\r\\n )\\r\\n } else if (depth == 5) {\\r\\n return(\\r\\n <h5\\r\\n id={id}\\r\\n className={classNames}\\r\\n >\\r\\n {trimmedTitle}\\r\\n </h5>\\r\\n )\\r\\n } else if (depth == 6) {\\r\\n return(\\r\\n <h6\\r\\n id={id}\\r\\n className={classNames}\\r\\n >\\r\\n {trimmedTitle}\\r\\n </h6>\\r\\n )\\r\\n } else {\\r\\n return(\\r\\n <>\\r\\n {trimmedTitle}\\r\\n </>\\r\\n )\\r\\n }\\r\\n })()}\\r\\n </div>\\r\\n );\\r\\n}\\r\\n// highlight-end\\r\\nfunction AdmonitionContent({children}) {\\r\\n return children ? (\\r\\n <div className={styles.admonitionContent}>{children}</div>\\r\\n ) : null;\\r\\n}\\r\\nexport default function AdmonitionLayout(props) {\\r\\n // highlight-next-line\\r\\n const {type, icon, title, children, className, id} = props;\\r\\n return (\\r\\n <AdmonitionContainer type={type} className={className}>\\r\\n // highlight-next-line\\r\\n <AdmonitionHeading title={title} icon={icon} id={id} />\\r\\n <AdmonitionContent>{children}</AdmonitionContent>\\r\\n </AdmonitionContainer>\\r\\n );\\r\\n}\\r\\n```\\r\\n\\r\\n\u4e0a\u8a18\u3092\u8a2d\u5b9a\u5f8c\u3001npm start\u7b49\u306e\u518d\u8d77\u52d5\u304c\u5fc5\u8981\u3067\u3059\u3002\\r\\n\\r\\n\u4ee5\u4e0a\u3067\u3059\u3002"},{"id":"/2024/01/26/new-flat-blog","metadata":{"permalink":"/docs/blog/2024/01/26/new-flat-blog","source":"@site/blog/2024/01/26/new-flat-blog/index.mdx","title":"\u65b0\u3075\u3089\u3063\u3068\u30d6\u30ed\u30b0\u7acb\u3061\u4e0a\u3052\u307e\u3057\u305f","description":"\u65b0\u3075\u3089\u3063\u3068\u30d6\u30ed\u30b0\u7acb\u3061\u4e0a\u3052\u307e\u3057\u305f\u3002\u8b70\u54e1\u6d3b\u52d5\u3084\u305d\u306e\u88cf\u3067\u6d3b\u7528\u3057\u3066\u3044\u308b\u6280\u8853\u306b\u3064\u3044\u3066\u3001\u8ab0\u304b\u306e\u5f79\u306b\u7acb\u3064\u304b\u3082\u3057\u308c\u306a\u3044\u3053\u3068\u3092\u4e2d\u5fc3\u306b\u307e\u3068\u3081\u3066\u3044\u307e\u3059\u3002","date":"2024-01-26T00:00:00.000Z","formattedDate":"2024\u5e741\u670826\u65e5","tags":[{"label":"\u304a\u77e5\u3089\u305b","permalink":"/docs/blog/tags/\u304a\u77e5\u3089\u305b"},{"label":"docusaurus","permalink":"/docs/blog/tags/docusaurus"}],"readingTime":0.56,"hasTruncateMarker":false,"authors":[{"name":"\u5b89\u7af9 \u6d0b\u5e73","title":"\u6771\u4eac\u90fd\u5c0f\u5e73\u5e02\u8b70\u4f1a\u8b70\u54e1","url":"https://yasutakeyohei.com","email":"yohei@yasutakeyohei.com","imageURL":"https://cgit.yasutakeyohei.com/yohei.jpg","key":"yohei"}],"frontMatter":{"title":"\u65b0\u3075\u3089\u3063\u3068\u30d6\u30ed\u30b0\u7acb\u3061\u4e0a\u3052\u307e\u3057\u305f","description":"\u65b0\u3075\u3089\u3063\u3068\u30d6\u30ed\u30b0\u7acb\u3061\u4e0a\u3052\u307e\u3057\u305f\u3002\u8b70\u54e1\u6d3b\u52d5\u3084\u305d\u306e\u88cf\u3067\u6d3b\u7528\u3057\u3066\u3044\u308b\u6280\u8853\u306b\u3064\u3044\u3066\u3001\u8ab0\u304b\u306e\u5f79\u306b\u7acb\u3064\u304b\u3082\u3057\u308c\u306a\u3044\u3053\u3068\u3092\u4e2d\u5fc3\u306b\u307e\u3068\u3081\u3066\u3044\u307e\u3059\u3002","authors":"yohei","tags":["\u304a\u77e5\u3089\u305b","docusaurus"],"hide_table_of_contents":false},"unlisted":false,"prevItem":{"title":"Docusaurus\u306e\u6ce8\u610f\u66f8\u304d\u3084\u8b66\u544a\u6587\u306e\u30bf\u30a4\u30c8\u30eb\u3092\u898b\u51fa\u3057\u306b\u3057\u3066\u3001\u76ee\u6b21\u306b\u3082\u4e57\u305b\u308b\u65b9\u6cd5","permalink":"/docs/blog/2024/01/27/docusaurus-admonition-heading-toc"}},"content":"\u4eca\u5f8c\u306e\u5c55\u958b\u3092\u8003\u3048\u3001\u3053\u308c\u307e\u3067\u306e\u8b70\u4f1a\u6d3b\u52d5\u7b49\u306e\u307e\u3068\u3081\u3092\u3053\u306eDocusaurus\u306e\u4ed5\u7d44\u307f\u306b\u79fb\u884c\u3057\u3066\u3044\u307e\u3059\u3002\\r\\n\\r\\n\u3075\u3089\u3063\u3068\u30d6\u30ed\u30b0\u3082\u3053\u3061\u3089\u306b\u65b0\u3057\u304f\u7acb\u3061\u4e0a\u3052\u308b\u3053\u3068\u306b\u3057\u307e\u3057\u305f\u3002\\r\\n\\r\\n\u8b70\u54e1\u6d3b\u52d5\u3084\u3001\u305d\u306e\u88cf\u3067\u6d3b\u7528\u3057\u3066\u3044\u308b\u6280\u8853\u306b\u3064\u3044\u3066\u3001\u8ab0\u304b\u306e\u5f79\u306b\u7acb\u3064\u304b\u3082\u3057\u308c\u306a\u3044\u3053\u3068\u3092\u4e2d\u5fc3\u306b\u30d6\u30ed\u30b0\u306b\u3057\u3066\u3044\u304d\u307e\u3059\ud83d\ude01"}]}')}}]);
|
