mdlineというMarkdownでタイムライン(年表)を書いて、HTMLなどの形式にしたりできるパーサ、ジェネレーターなどのツールを書きました。

たとえば、次のようにECMAScriptのタイムライン(年表)をmdlineが決めたMarkdown形式で書きます。

## 1997-06: ECMAScript 1

First edition.

## 1998-06: ECMAScript 2

Editorial changes to keep the specification fully aligned with ISO/IEC 16262 international standard.

## 1999-12: ECMAScript 3

Added regular expressions, better string handling, new control statements, try/catch exception handling, tighter definition of errors, formatting for numeric output and other enhancements.

## 2000-01--2007-10-23: [Abandoned] ECMAScript 4

Fourth Edition was abandoned, due to political differences concerning language complexity. Many features proposed for the Fourth Edition have been completely dropped; some were incorporated into the sixth edition.

これを npx mdline ./timeline.md -o timeline.html で変換すると、次のようなHTMLを生成できます。

ECMAScript timeline

記法

今のところサポートしている記法はものすごくシンプルに、日付とタイトルと本文という感じ。

## Date: TITLE

MARKDOWN BODY

## Date--Date: TITLE

MARKDOWN BODY
--は日付の区切り

使い方

上記の記法で書いたMarkdownファイルをmdlineコマンドでHTMLに変換するだけです。

npm i -g mdline
mdline ./timeline.md -o timeline.html
# or
npx mdline ./timeline.md -o timeline.html

元々、JSer.info 8周年 - JSer.infoの記事を書くために作ったツールなので、必要最低限の機能でリリースしています。

コード

HTMLのテンプレートになぜかSvelteを使っています。

Svelteは自動的に使ってないCSSセレクタを削除したり、Scoped CSS的な概念が入っていたりするので、リッチなテンプレートエンジン的にも使えます。 また、<svelte:head> や<svelte:document>といった通常のテンプレートでは扱いにくい、<head>などを同じファイル内で分けて書ける仕組みもあるので、使い方によっては便利かもしれません。（まあ今回は別にSvelteじゃなくても問題なかったけど、試してみたかった）

内部構造的には、HTML以外への出力もプラガブルにできるような作りになっています。 まだ実装がありませんが、興味がある人は次のIssueを参照して、Pull Requestを送ってみてください。

構造的には、ESLintやtextlintのようなパーサとフォーマッターがプラグイン(別モジュール)として差し替えできるような作りにしています。

また、Lerna + TypeScriptなシンプルなmonorepoになっているので、この構造に興味がある人は見てみると面白いかもしれません。(今度このmonorepo構造について記事を書くかもしれません。)

似たようなツールとして次のようなものがあります