diff --git a/cspell.json b/cspell.json index 00cc776..87af725 100644 --- a/cspell.json +++ b/cspell.json @@ -14,6 +14,7 @@ ], "words": [ "drawio", + "katex", "markdownlint", "stylesheet", "textlint", diff --git a/docs/_document-template/contents.md b/docs/_document-template/contents.md index 6fa957c..c666b1d 100644 --- a/docs/_document-template/contents.md +++ b/docs/_document-template/contents.md @@ -47,6 +47,7 @@ dest: ./output/ドキュメントテンプレート.pdf - [2.15. 水平線](#215-水平線) - [2.16. エスケープ](#216-エスケープ) - [2.17. アラート](#217-アラート) + - [2.18. 数式](#218-数式) - [3. 参考資料](#3-参考資料) # 1. ドキュメントの全体設定 @@ -565,6 +566,43 @@ tip の内容。 warning の内容。 !!! +## 2.18. 数式 + +[KaTeX](https://katex.org/) で数式を記述できます。 +インラインに数式を入力する場合は、 `$` で囲った中に、 KaTeX の構文を記述してください。 +`$` の前後にスペースを 1 つ以上入れてください。 + +```md +インラインに数式を $c = \pm\sqrt{a^2 + b^2}$ のように記述できます。 +``` + +これは次のようにレンダリングされます。 + +インラインに数式を $c = \pm\sqrt{a^2 + b^2}$ のように記述できます。 + +`$$` で囲うと、ブロック要素として KaTeX の構文を記載できます。 +`$$` の前後に空行を設けてください。 + +```md +$$ +\begin{cases} + &10x &+ &3y &= &2 \\ + &3x &+ &13y &= &4 +\end{cases} +$$ +``` + +これは次のようにレンダリングされます。 + +$$ +\begin{cases} + &10x &+ &3y &= &2 \\ + &3x &+ &13y &= &4 +\end{cases} +$$ + +ブロック要素とした場合、数式は中央寄せで配置されます。 + # 3. 参考資料 詳細な構文については、以下をご覧ください。 diff --git a/md-to-pdf-config.js b/md-to-pdf-config.js index 8fb2363..e9dae0b 100644 --- a/md-to-pdf-config.js +++ b/md-to-pdf-config.js @@ -1,4 +1,9 @@ const admonition = require('marked-admonition-extension'); +const markedKatex = require('marked-katex-extension'); + +const markedKatexOptions = { + throwOnError: false + }; const mermaid_renderer = { code(code, infoString) { @@ -10,10 +15,13 @@ const mermaid_renderer = { }; module.exports = { - stylesheet: ["https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.7.0/github-markdown.min.css", - "docs/base-style.css"], + stylesheet: [ + "https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.7.0/github-markdown.min.css", + "https://cdn.jsdelivr.net/npm/katex/dist/katex.min.css", + "docs/base-style.css" + ], body_class: 'markdown-body', - marked_extensions: [ admonition.default ], + marked_extensions: [ admonition.default, markedKatex(markedKatexOptions) ], marked_options: [{ mermaid_renderer }], pdf_options: { format: 'a4', @@ -24,7 +32,9 @@ module.exports = { }, script: [ { url: 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js' }, - { content: "mermaid.initialize({ startOnLoad: false, themeVariables: { fontSize: '14px', fontFamily: 'Yu Gothic UI, system-ui' } }); (async () => { await mermaid.run(); })();" } + { content: "mermaid.initialize({ startOnLoad: false, themeVariables: { fontSize: '14px', fontFamily: 'Yu Gothic UI, system-ui' } }); (async () => { await mermaid.run(); })();" }, + { url: 'https://cdn.jsdelivr.net/npm/katex/dist/katex.min.js' }, + { url: 'https://cdn.jsdelivr.net/npm/marked-katex-extension/lib/index.umd.js' }, ], stylesheet_encoding: 'utf-8', }; diff --git a/package-lock.json b/package-lock.json index 6c9b856..1d160a0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "cspell-cli": "^8.16.1", "markdownlint-cli2": "^0.16.0", "marked-admonition-extension": "^0.0.4", + "marked-katex-extension": "^5.1.3", "md-to-pdf": "^5.2.4", "npm-run-all2": "^7.0.1", "sudachi-synonyms-dictionary": "^14.0.0", @@ -1199,6 +1200,13 @@ "dev": true, "license": "MIT" }, + "node_modules/@types/katex": { + "version": "0.16.7", + "resolved": "https://registry.npmjs.org/@types/katex/-/katex-0.16.7.tgz", + "integrity": "sha512-HMwFiRujE5PjrgwHQ25+bsLJgowjGjm5Z8FVSf0N6PwgJrwxH0QxzHYDcKsTfV3wva0vzrpqMTJS2jXPr5BMEQ==", + "dev": true, + "license": "MIT" + }, "node_modules/@types/marked": { "version": "4.3.2", "resolved": "https://registry.npmjs.org/@types/marked/-/marked-4.3.2.tgz", @@ -4480,6 +4488,35 @@ "graceful-fs": "^4.1.6" } }, + "node_modules/katex": { + "version": "0.16.15", + "resolved": "https://registry.npmjs.org/katex/-/katex-0.16.15.tgz", + "integrity": "sha512-yE9YJIEAk2aZ+FL/G8r+UGw0CTUzEA8ZFy6E+8tc3spHUKq3qBnzCkI1CQwGoI9atJhVyFPEypQsTY7mJ1Pi9w==", + "dev": true, + "funding": [ + "https://opencollective.com/katex", + "https://github.com/sponsors/katex" + ], + "license": "MIT", + "peer": true, + "dependencies": { + "commander": "^8.3.0" + }, + "bin": { + "katex": "cli.js" + } + }, + "node_modules/katex/node_modules/commander": { + "version": "8.3.0", + "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz", + "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==", + "dev": true, + "license": "MIT", + "peer": true, + "engines": { + "node": ">= 12" + } + }, "node_modules/keyv": { "version": "4.5.4", "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz", @@ -5142,6 +5179,20 @@ "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==", "dev": true }, + "node_modules/marked-katex-extension": { + "version": "5.1.3", + "resolved": "https://registry.npmjs.org/marked-katex-extension/-/marked-katex-extension-5.1.3.tgz", + "integrity": "sha512-j4qu6XxFdP5v1VQ1QJ2I3H2DZLd0ak+98L0/IryZ/LHDcKikppHbaydNzVv3EE7t5/Tsrfuywnzlu46lCz0FrQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/katex": "^0.16.7" + }, + "peerDependencies": { + "katex": ">=0.16 <0.17", + "marked": ">=4 <16" + } + }, "node_modules/match-index": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/match-index/-/match-index-1.0.3.tgz", diff --git a/package.json b/package.json index a97482e..a16f9d7 100644 --- a/package.json +++ b/package.json @@ -1,4 +1,5 @@ { + "type": "commonjs", "scripts": { "build": "run-s build:* --continue-on-error --print-label", "build:document-template": "npx md-to-pdf --config-file ./md-to-pdf-config.js ./docs/_document-template/contents.md", @@ -12,6 +13,7 @@ "cspell-cli": "^8.16.1", "markdownlint-cli2": "^0.16.0", "marked-admonition-extension": "^0.0.4", + "marked-katex-extension": "^5.1.3", "md-to-pdf": "^5.2.4", "npm-run-all2": "^7.0.1", "sudachi-synonyms-dictionary": "^14.0.0", diff --git a/pdf-sample.md b/pdf-sample.md index 8f5be73..b450f61 100644 --- a/pdf-sample.md +++ b/pdf-sample.md @@ -82,3 +82,12 @@ PDF 上でチェックボックスのオン / オフを切り替えることは 全部で 16 種類のアラートが利用できます。 ![アラートのサンプル](https://github.com/user-attachments/assets/3c4cc088-5c23-40fb-9e63-80b0c4aaadb3) + +## 数式 + +[KaTeX](https://katex.org/) を使って数式を記述できます。 +インライン要素、ブロック要素、どちらにも対応しています。 + +![数式（インライン要素）のサンプル](https://github.com/user-attachments/assets/34f62912-1946-43e8-b95a-93d544fcbe8b) + +![数式（ブロック要素）のサンプル](https://github.com/user-attachments/assets/f987245c-9fae-4c30-8743-750a87ede06d)