Skip to content

Note Miniblock Features

Jump to bottom
Daisuke Tsukada edited this page Sep 8, 2025 · 1 revision

Note/Miniblock機能

Re:VIEW 5.8 対応の Note/Miniblock 機能について説明します。

概要

情報を構造化し、視覚的に区別しやすくするための Note ブロックと 7 種類のミニブロック機能を提供します。

Note ブロック

基本構文

//note[タイトル]{
  内容
//}

ラベル付き Note（参照可能）

//note[ラベル][タイトル]{
  内容
//}

# 参照
@<noteref>{ラベル}を参照してください。

使用例

//note[API使用上の注意]{
認証トークンを必ず含めてください。
レート制限は1分間に60リクエストです。
//}

//note[auth_flow][認証フロー]{
OAuth 2.0を使用します。
詳細は@<noteref>{auth_flow}を参照。
//}

ミニブロック一覧

情報系ブロック

info（情報）

一般的な情報や補足説明に使用します。

//info[システム要件]{
- Node.js 18.0以上
- npm 9.0以上
- MongoDB 6.0以上
//}
  • アイコン: 📘（青色の情報アイコン）
  • 背景色: 青系
  • 用途: 一般的な情報、要件、仕様など

tip（ヒント）

便利な使い方やコツを伝える際に使用します。

//tip[パフォーマンス向上のコツ]{
インデックスを適切に設定することで、
クエリ速度が大幅に改善されます。
//}
  • アイコン: 💡（電球アイコン）
  • 背景色: 緑系
  • 用途: ベストプラクティス、効率的な方法、ショートカット

memo（メモ）

開発メモや備忘録として使用します。

//memo[TODO]{
- エラーハンドリングの追加
- テストケースの作成
- ドキュメントの更新
//}
  • アイコン: 📝（メモアイコン）
  • 背景色: グレー系
  • 用途: TODO、備忘録、一時的なメモ

警告系ブロック

warning（警告）

注意が必要な事項を伝える際に使用します。

//warning[非推奨のAPI]{
このAPIは次期バージョンで削除されます。
新しいAPIへの移行を推奨します。
//}
  • アイコン: ⚠️（警告アイコン）
  • 背景色: オレンジ系
  • 用途: 非推奨機能、潜在的な問題、移行の必要性

caution（注意）

慎重な操作が必要な場合に使用します。

//caution[データベース操作]{
マイグレーション前に必ずバックアップを
取得してください。
//}
  • アイコン: ⚠️（注意アイコン）
  • 背景色: 黄色系
  • 用途: データ損失リスク、不可逆的な操作、慎重な確認が必要な事項

important（重要）

重要度が高い情報を強調する際に使用します。

//important[破壊的変更]{
v3.0.0には以下の破壊的変更が含まれます：
- APIエンドポイントの変更
- 設定ファイル形式の変更
//}
  • アイコン: ❗（重要アイコン）
  • 背景色: 赤系
  • 用途: 破壊的変更、セキュリティ問題、重大な影響

お知らせ系ブロック

notice（お知らせ）

アナウンスや通知に使用します。

//notice[メンテナンス予定]{
2024年12月25日 02:00-05:00 (JST)
システムメンテナンスを実施します。
//}
  • アイコン: 📢（お知らせアイコン）
  • 背景色: 紫系
  • 用途: メンテナンス情報、リリース情報、イベント告知

スタイリング

PDF出力（LaTeX）

review-custom.sty ファイルで tcolorbox パッケージを使用してスタイリングされます：

\usepackage{tcolorbox}
\tcbuselibrary{skins,breakable}

\renewenvironment{reviewinfo}[1][]{%
  \begin{tcolorbox}[
    enhanced,
    colback=blue!5!white,
    colframe=blue!50!black,
    title={📘 #1},
    fonttitle=\bfseries,
    breakable
  ]%
}{%
  \end{tcolorbox}%
}

HTML出力

CSSクラスが自動的に付与されます：

  • rs-info
  • rs-tip
  • rs-memo
  • rs-warning
  • rs-caution
  • rs-important
  • rs-notice

アイコンサポート

各ミニブロックには対応するアイコンが表示されます：

  • SVG版: Web表示用（img/*.svg）
  • PNG版: PDF出力用（img/*.png）

※ 現在、PDF出力時のPNGアイコン表示には既知の問題があります（Issue #18）

実践的な使用例

APIドキュメント

//info[エンドポイント]{
POST /api/users
新規ユーザーを作成します。
//}

//warning[認証必須]{
Bearerトークンが必要です。
//}

//tip[レート制限]{
1時間あたり1000リクエストまで。
//}

エラーハンドリング

//important[エラー処理必須]{
すべてのAPI呼び出しには
適切なエラーハンドリングを実装してください。
//}

//caution[ログ出力]{
個人情報をログに含めないよう注意。
//}

デプロイ手順

//info[前提条件]{
- テスト成功
- コードレビュー完了
- ステージング確認済み
//}

//warning[本番環境]{
本番デプロイは管理者権限が必要です。
//}

//notice[定期メンテナンス]{
毎月第1月曜日の深夜に実施。
//}

abstract から lead への変換

Re:VIEW 5.8 で廃止された //abstract は自動的に //lead に変換されます：

# 旧形式
//abstract{
  概要文
//}

# 新形式（自動変換後）
//lead{
  概要文
//}

プリプロセッササポート

review-preprocess コマンドで以下の処理が自動化されます：

  1. abstract → lead 変換
  2. ミニブロックへのメタデータ埋め込み
  3. アイコンパスの記録
  4. CSSクラスの付与
npx review-preprocess "articles/**/*.re" --out-dir .out

注意事項

  • タイトルは省略可能です（空の場合はタイトルバーなし）
  • ミニブロック内でもリスト記法など他の Re:VIEW 記法が使用可能
  • PDF出力時のアイコン表示には LaTeX 環境の設定が必要

関連ドキュメント

Clone this wiki locally