@QiitaTeam
Jun 01, 2022 14:44:25

Markdownパーサーの変更について

Qiita Markdown

Qiita TeamおよびQiitaでは、Markdown記法を使用できます。
Qiita Markdownについては、下記リンクを参照下さい。

Markdown記法 チートシート - Qiita
※Mermaid記法は、今後対応予定となります。
※Mermaid記法も使えるようになりました。

Markdownパーサーの変更

エディタの品質・体験の向上、およびQiitaとのMarkdownとの差異を極力減らすために、2022年6月1日にQiita TeamにおいてMarkdownパーサーを変更しました。

もともと使用していたパーサーはRedcarpetをベースに拡張したものでしたが、CommonMarkerベースになります。これにより、一部のMarkdownの記法に変更が生まれました。今までは GitHub Flavored Markdownに準拠していない記法もありましたが、今回の変更で準拠されるようになりました。

そのため、パーサー変更前に投稿されたコンテンツを更新する際に、予期していない見た目に変わってしまう場合があります。

記法の変更について

基本的にはGitHub Flavored Markdownに準拠しているので、詳しくは GitHub Flavored Markdown Spec をご確認ください。準拠いただくことで、Markdownパーサーの変更後の差異を減らすことができます。

以下では実際の記事で差分が多かった記法をいくつか紹介します。

  • 【見出し】#の後にスペースがない場合、見出しとして判定されなくなる
    • 今までは#の後にスペースがなくても見出しになっていましたが、今後はスペースが必要となります。
##これが見出しとして判定されなくなる

## スペースが入ることで見出しとなる
  • 【HTMLブロック】Markdownにパースしたい場合は、間に空行が必要になる
    • detailsタグなどのHTMLタグを埋め込む際には、1行空行を入れるようにしてください。
<details><summary>サマリー</summary>

## 空行の後にMarkdownを記述できる

- Markdownのリスト

段落なども普通にパースされる。
</details>

この上にも空行が必要

その他にも数としては多くはなかったのですが、いくつか見られたものも記載します。

  • 【強調】強調記号の前後のスペースのありなしによって、意図しない強調がされる可能性がある

    • 適切に強調をしたい場合は 平文 **強調したいテキスト** 平文 のように前後にスペースを入れてください。

  • 【リスト】一つ上のレベルのリストと比べて スペース2つ の差が無いとインデントされなくなる

  • 【順序付きリスト】以下の bar と baz は順序付きリストと判定されなくなります。

1. foo
- bar
- baz
  • 【引用ブロック】引用ブロックと引用ブロックの間に空行があると別の引用ブロックになる
> 1つ目の引用ブロック
ここも1つ目の引用ブロック

> 2つ目の引用ブロックになる
  • 【テーブル】テーブルの後に改行が必要になる
| カラム1 | カラム2 |
|:--:|:--:|
| テーブル内| テーブル内 |
ここもテーブル内としてパースされるようになる
  • 【リンク、画像】途中で改行があるとリンク、画像として判定されなくなる
# NG
[Qiita]
(https://qiita.com/)

![Qiita.png]
(https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/1deed096-f608-0037-d2c5-3015d6854212.png)

# OK
[Qiita](https://qiita.com/)

![Qiita.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/1deed096-f608-0037-d2c5-3015d6854212.png)
  • 【コードスパン】コードスパンで囲まれていると改行されなくなる
    • 以下のように書いた場合、fuga fugaの間で改行がなくなります。
`hogehoge` and `fuga
fuga`

  • 【コードブロック】フェンス(`や~)の始まりと終わりで別の記号を使えなくなる

    • 始まりと終わりの記号を合わせていただく必要があります。

  • 【文字】タブ文字がスペースに変換されていたが、そのままタブ文字として表示される

    • 今まではパーサーの設定により、タブ文字がスペースになっていましたが、タブ文字として表示されます｡

最後に

これからもQiita Teamの改善に取り組んでいきます。
もし、ご不明点がありましたらサポートフォームより問い合わせください。

Back to index page