0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

docsifyで数式を書けるようにする

Last updated at Posted at 2020-01-12

はじめに

docsifyは、ドキュメントWebページを作成するツールです。静的なHTMLをジェネレートするのではなく、Markdownをパースして表示するSPAのように動作します。

セットアップ

macOS Catalina 10.15.2 で作業しました。docsifyは、npmでインストールできます。

$ npm i docsify-cli -g

initコマンドで、ドキュメントの雛形を作ります。

$ docsify init hoge

serveコマンドで、ローカルにサーバーが立ち上がりプレビューが見ることができます。もととなるMarkdownファイルが変更されると、スグに反映されます。

$ docsify serve hoge

Serving /Users/yoshoku/hoge now.
Listening at http://localhost:3000

数式を書けるようにする

数式の表示には、docsify-katexを利用します。KaTeXは、WebページでTeXによる数式をレンダリングするライブラリで、有名なMathJaxよりも速く動作するそうです。docsify-katexは、このKaTeXをdocsifyで利用できるようにしたものです。

セットアップ

利用は簡単で、initコマンドで作成されたindex.htmlに、scriptタグをbodyタグ内の末尾などに追加するだけです。

... 省略

  <!-- CDN files for docsify-katex -->
  <script src="//cdn.jsdelivr.net/npm/docsify-katex@latest/dist/docsify-katex.js"></script>
  <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/katex@latest/dist/katex.min.css"/>
</body>
</html>

これでOKです。

数式の書き方

$でくくります。$が一つであれば行内に、$が二つであれば改行して、数式をレンダリングします。

改行する感じの数式
$$\mathbf{x}\in\mathcal{R}^{d}$$
です。

改行しない感じの数式 $\mathbf{x}\in\mathcal{R}^{d}$ です。

これが、以下のようになります。

math.png

おわりに

docsifyは気軽に書けていいですね。

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?