コンテンツにスキップ

Mkdocs

基本リンク集

このサイトを生成している静的サイトジェネレーターです.

KaTeXの導入, 特にmaterial

  • mkdocs.ymlに次のように追記
1
2
3
4
5
6
theme:
  name: material
  language: ja
  custom_dir: overrides
extra_javascript:
  - js/katex.js
  • js/katex.jsはマクロなどを書き込むファイルで, 以下の記述でもこの存在を前提にしている.
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
// odcs/js/katex.jsのサンプル
const delimiters = [
  {left: "$$", right: "$$", display: true},
  {left: "$", right: "$", display: false},
  {left: "\\(", right: "\\)", display: false},
  {left: "\\begin{equation}", right: "\\end{equation}", display: true},
  {left: "\\begin{align}", right: "\\end{align}", display: true},
  {left: "\\begin{alignat}", right: "\\end{alignat}", display: true},
  {left: "\\begin{gather}", right: "\\end{gather}", display: true},
  {left: "\\begin{CD}", right: "\\end{CD}", display: true},
  {left: "\\[", right: "\\]", display: true}
];
const macros = {
  "\\bkt": "\\left\\langle #1,\\,#2 \\right\\rangle"
  , "\\abs": "\\left| #1 \\right|"
  , "\\rbk": "\\left( #1 \\right)"
  , "\\cbk": "\\left\\{ #1 \\right\\}"
  , "\\sqbk": "\\left[ #1 \\right]"
  , "\\basebk": "\\left\\langle #1 \\right\\rangle"
  , "\\bbR": "\\mathbb{R}"
  , "\\bbRd": "\\mathbb{R}^d"
  , "\\bbC": "\\mathbb{C}"
  , "\\bbCd": "\\mathbb{C}\d"
  , "\\bbK": "\\mathbb{K}"
  , "\\vectorr": "\\boldsymbol{r}"
  , "\\vectorsigma": "\\boldsymbol{\\sigma}"
  , "\\vectorx": "\\boldsymbol{x}"
  , "\\id": "\\mathrm{id} \\,"
  , "\\Real": "\\mathrm{Re} \\,"
  , "\\Imag": "\\mathrm{Im} \\,"
  , "\\diag": "\\mathrm{diag}"
  , "\\Tr": "\\mathrm{Tr} \\, \\sqbk{#1}"
  , "\\norm": "\left\Vert #1 \right\Vert"
  , "\\myast": "*"
};
  • mkdocs.ymlと同じディレクトリにoverrides/main.htmlを作る.
  • 次の内容のファイルを作る.
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
{% extends "base.html" %}

{% block extrahead %}
{{ super() }}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.4/dist/katex.min.css" integrity="sha384-vKruj+a13U8yHIkAyGgK1J3ArTLzrFGBbBc0tDp4ad/EyewESeXE/Iv67Aj8gKZ0" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.4/dist/katex.min.js" integrity="sha384-PwRUT/YqbnEjkZO0zZxNqcxACrXe+j766U2amXcgMg5457rve2Y7I6ZJSm2A0mS4" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.4/dist/contrib/auto-render.min.js" integrity="sha384-+VBxd3r6XgURycqtZ117nYw44OOcIax56Z4dCRWbxyPt0Koah1uHoK0o4+/RRE05" crossorigin="anonymous"
        onload="renderMathInElement(document.body);"></script>
<script>
  document.addEventListener("DOMContentLoaded", function() {
    renderMathInElement(document.body,
                        { delimiters: delimiters, macros: macros });
  });
</script>
{% endblock %}
  • mkdocs buildで内容を確認する

ビルド時のjinja2エラー jinja2.exceptions.TemplateSyntaxError: Missing end of comment tag

  • テンプレートのhtml内に{#(もしくは#?)があるとコメントタグと判断して終わりの#}を探してしまう
  • katex用のマクロ中にまさに引数用の#1があってそれがエラーになっていた
  • katexのマクロ用の配列・オブジェクトは.jsファイルに逃がしたらビルドが通るようになった.

サンプル

例

Note

これはノートです.

Tip

ヒントです.

Warning

これは警告です

Danger

これは危険です.

Success

これは成功です.

Failure

これは失敗です.

Bug

これはバグです.

Summary

これは概要です.

定義リスト

定義リストは定義語のリストを作成する拡張機能です. この拡張機能を使うには markdown_extensions に def_list を追加する必要があります.

定義語
ここに定義を書きます.