📝
Typst でメモをとる

2024/12/25に公開
Vim
Neovim
Typst
tech
!この記事は Typst Advent Calendar 2024 の25日目の記事です。

 はじめにTypst は組版システムであり、論文や書籍などの原稿を組むための様々な機能が備わっています。 Typst Advent Calendar 2024 のこれまでの記事も、組版システムとしての機能に焦点を合わせたものが多かったですね。当然のことだと思います。
一方、Typst にはもう一つ、「独自構文を持つマークアップ言語」という重要な側面があります。 Typst は基本的な構文に限れば Markdown と類似しており、細かい仕様に目を瞑れば、軽量でとっつきやすいといえるでしょう。 Typst は新興組版システムであると同時に、新興軽量マークアップ言語でもあるのです。
軽量マークアップ言語の役割は組版だけではなく、むしろ組版を目的としない文書にも頻繁に使われます。 たとえば個人がメモを残すとき、Web ページや PDF といった出力形式を特に意識することなく、ただ情報をゆるく構造化して整理するために軽量マークアップ言語が使われることがあります。 Emacs の org-mode はまさにそういった用途の機能ですし、最近は Obsidian などを用いて Markdown でメモを取る人も増えています。 個人に限らず、企業でのナレッジ共有等にも Markdown はよく使われています。 このように、軽量マークアップ言語は情報の集約・整理・伝達という用途で重要な役割を果たしています。
このように考えると、Typst をメモ用途に用いるのは自然、むしろ当然のように思えてくるのではないでしょうか。
私はここ1年ほど、個人用の・仕事用のメモを Typst で取っていました。 ただ Typst のローカル執筆環境を整え、ちょっと Typst パッケージやエディタの補助プラグインを用意しただけですが、大きな不満なく使えています。 本記事では、Typst をメモ用途に使うために整えた環境の紹介、そしてその使い勝手について簡単に紹介します。

 メモを取るための Typst 執筆環境見出しや箇条書き、コードブロックなど、基本的な Typst の構文は Markdown と類似しています。 そのため、「単にメモを取るだけ」であれば困ることはほとんどありません。極端な話、メモを書き残すだけなら Typst コンパイラすらいりません。
一方で、快適にメモを取りたければ以下のような機能も欲しくなります。
メモを気軽に開く・編集する・検索する機能
複数ファイルに分けて記述したときに、片方から片方を参照する機能
整理されたレイアウトで文書を表示する機能
これらを実現するには Typst 処理系とテキストエディタの支援が必要となります。 Neovim ユーザの私は、メモ用の Typst パッケージと Neovim プラグインをサクっと作り、メモが取りやすい環境を実現しました。
https://github.com/monaqa/typscrap.nvim
なおこのリポジトリは MIT ライセンスで公開しているものの、個人用に作ったパッケージ + プラグインであり、他の人が使うことを想定していません。フォントなど環境依存の箇所も多いため、あくまで実装の参考程度としてください。

 typscrap.nvim のコンセプトtypscrap.nvim では、たとえば以下のようなディレクトリ構造で構造的にメモを格納していきます。
(typscrap_root)/
├── article/
│   └── advent_calendar/
│       └── typst/
│           ├── index.typ     # 文書本体を記述する
│           └── preview.typ   # index.typ を include し、レイアウトを整えてプレビューする
├── rust/
│   └── tauri/
│       ├── index.typ
│       └── preview.typ
└── typst/
    ├── document/
    │   ├── index.typ
    │   └── preview.typ
    └── tips/
        ├── index.typ
        └── preview.typ
typscrap.nvim では typscrap_root から index.typ までの相対パスを ID がわりにして管理しています。上のディレクトリ構造の場合は4つのメモが存在することになります。
article/advent_calendar/typst
rust/tauri
typst/document
typst/tips
index.typ にはメモ本体を、preview.typ には index.typ をきれいにプレビューするためのお膳立てコードを書きます。
たとえば index.typ は以下のようになっています。
index.typ
//! target: ./preview.typ
#import "@local/class-typscrap:0.1.0": component; #import component: *
#meta(slug: "article/advent_calendar/typst")

= Typst Advent Calendar 2024

どんなネタにしよう？

#scrap("typst/tips") に書いてある内容がいいかも。

- Typst のはじめかた
- Typst でメモを取る

== Typst のはじめかた

...
preview.typは自動生成されるコードで、以下のようになっています。
preview.typ
#import "@local/class-typscrap:0.1.0": layout

#show: layout.document

#include "index.typ"
preview.typ をコンパイルすると以下のような PDF ができあがります。class-typscrap というパッケージでレイアウトを調整しており、個人メモとして読むぶんの可読性は十分です。

 Neovim との連携メモの新規作成や検索を楽に実行するため、Neovim 用の簡素なプラグインも実装しました。 :Typscrap [slug] は簡単にメモを開くためのコマンドであり、実行すると該当する [slug] のメモが開かれます。なお、index.typ と preview.typ が存在しなければ自動生成されます。
また、メモから他のメモが簡単にリンクできるよう、以下のような機能も搭載しています。

Typscrap コマンドやメモ中で slug の補完候補を出す
slug 表記上で gf コマンドを押すことで、対象のメモにジャンプする
また、ファジーファインダーと連携してメモを検索することもできます。
実装の詳細は主題から外れるため割愛しますが、このあたりの機能を揃えておけば日常のメモ書きで困ることはほとんどありませんでした。

 Markdown から Typst に変えて良かったことかつては私も Markdown でメモを取っていたのですが、メモ書きを Typst に変えて良かったことがいくつかあります。
記法自体の拡張性が Markdown より高く柔軟である
複雑な表組みなど、Markdown で書きづらいものも Typst なら比較的書きやすいです。
Typst は「軽量マークアップ言語」と言いましたが、プログラミング言語でもあります。 いざとなったら自分でプログラムすることでプレビュー時の表示を自由度高くカスタマイズできます。
例: たとえば #progress_bar(60%) で 60% 埋まったプログレスバーを表示する、みたいなこともできます。
行コメントができる
Typst では、基本的に // を打ち込むことで行末までコメントアウトされます [1]。 C 言語と同じスタイルですね。
行単位でのコメント記法は Markdown の <!-- ... --> よりも扱いやすく、便利です。
個人用のメモにコメント記法要るの？と思うかもしれませんが、私はよく使います。たとえばこの記事の下書きでも多用しました。
数式をネイティブでサポートしている
個人用のメモで数式が書きたいときに書けるの、嬉しいですよね。

 他形式へのエクスポートについて今のままでも PDF 出力はできますが、インタラクティブなインターフェースを考えるとやはり HTML 出力 + ブラウザでのプレビューが欲しくなります。 実際、HTML に変換できることは Markdown の大きな強みです。 Typst から HTML といった他マークアップ言語への変換・出力はできるのでしょうか。これに関しては以下が答えになります。
公式の HTML エクスポート機能は2024年12月時点で開発中である。
なお、開発版では一部のマークアップのみ HTML エクスポートがサポートされている。
Pandoc を用いた変換もできる。
Pandoc なら HTML のほかに、Markdown など他形式への変換も可能。

 公式の HTML エクスポート実は Typst の HTML export 機能は公式が長期的に開発を見据えている機能であり、 Roadmap にも “HTML export” という記述があります。動向が気になる人は HTML の Tracking issue をウォッチしておくとよいでしょう。
https://github.com/typst/typst/issues/5512
さらに現況が待てない！という人は、実際に typst/typst リポジトリをローカルにクローンして最新版をビルドし、試しに使ってみるといいかもしれません。 Rust 開発環境さえあれば、ローカルの Git リポジトリ直下で以下のコマンドを実行するだけで簡単に HTML export できます。
cargo run --release --bin typst -- compile input.typ --features html -f html -
まだ数式や表組版などは未サポートですが、箇条書きや見出しなど単純なマークアップは変換できるようです。

 Pandoc による変換公式の対応が待ちきれない方は Pandoc による変換を試してみるとよいでしょう。 Typst の reader と writer が有志の手で両方実装されており、HTML に限らず Markdown など他フォーマットとの相互変換も可能です。
個人的には、Typst → Markdown への変換をよく使っています。 たとえば本記事のような Zenn での記事執筆も、まず Typst で本文を書いてから Pandoc で Markdown に変換しています。
それだけでなく、Typst の柔軟な記法、豊富な機能と組み合わせれば、たとえば JSON や TOML 形式のデータを読み込んで Markdown のテーブルに整形する、といったことも簡単にできてしまいます。 たとえば以下の Cargo.lock ファイルがあったとします（typst/typst リポジトリから引っ張ってきたものです）。
# This file is automatically @generated by Cargo.
# It is not intended for manual editing.
version = 3

[[package]]
name = "adler2"
version = "2.0.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "512761e0bb2578dd7380c6baaa0f4ce03e84f95e960231d1dec8bf4d7d6e2627"

[[package]]
name = "ahash"
version = "0.8.11"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "e89da841a80418a9b391ebaea17f5c112ffaaa96f621d2c285b5174da76b9011"
dependencies = [
 "cfg-if",
 "once_cell",
 "version_check",
 "zerocopy",
]

[[package]]
name = "aho-corasick"
version = "1.1.3"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "8e60d3430d3a69478ad0993f19238d2df97c507009a52b3c10addcd7f6bcb916"
dependencies = [
 "memchr",
]

...
このファイルと同階層に以下のような Typst ファイルを置きます。
test.typ
#let data = toml("Cargo.lock")

= 依存パッケージ

- 主要なパッケージの依存

  #table(columns: 2, align: (right, left),
    ..{
      let th(..args) = (table.header(..args.pos()),)
      let tr(..args) = (..args.pos(),)

      th[パッケージ名][バージョン]
      for package in data.package.slice(0, 10) {
        tr[#package.name][#raw(package.version)]
      }
    },
  )
pandoc コマンドを用いて、Typst 形式から GitHub Flavored Markdown (GFM) 形式に変換してみましょう。
pandoc -f typst -t gfm test.typ
すると、以下のような Markdown のテキストが生成されます。
# 依存パッケージ

- 主要なパッケージの依存

  |              パッケージ名 | バージョン |
  |--------------------------:|:-----------|
  |                    adler2 | `2.0.0`    |
  |                     ahash | `0.8.11`   |
  |              aho-corasick | `1.1.3`    |
  |            android-tzdata | `0.1.1`    |
  | android_system_properties | `0.1.5`    |
  |                  anstream | `0.6.15`   |
  |                   anstyle | `1.0.8`    |
  |             anstyle-parse | `0.2.5`    |
  |             anstyle-query | `1.1.1`    |
  |            anstyle-wincon | `3.0.4`    |
このように、Typst と Pandoc のおかげで JSON や TOML などのデータ記述を簡単にマークアップ言語の記述に落とし込めるようになりました。 メモ用途に限らず、工夫次第では様々な場所で楽ができるテクニックではないでしょうか。

 おわりにTypst を用いた個人的なメモの作成環境を紹介しました。他人が使うためのパッケージまでは昇華できていませんが、少しでも参考になればと思います。
Markdown でメモを取っている方。2025年からは Typst でメモを取ってみませんか？

脚注
URL (e.g. https://example.com) の中の // はコメント扱いされないなど、例外もあります。 ↩︎
はじめに

メモを取るための Typst 執筆環境

typscrap.nvim のコンセプト

Neovim との連携

Markdown から Typst に変えて良かったこと

他形式へのエクスポートについて

公式の HTML エクスポート

Pandoc による変換

おわりに

Discussion
