markdownの改行記法あれこれとVSCodeの便利な設定

要約

• markdown記法で書くとき、同一の段落内で改行したい場合は行末に半角スペースを2つ書けばOK。(空行は不要)
• VSCodeでスペースやタブをもれなく表示したい場合は、設定でEditor: Render Whitespaceをallにするとよいです。

昨日までの私

文章を改行したいときにはすべて空行を作っていました・・・

恥ずかしながら、文末に「半角スペースを2つ」入れれば改行できることを今日知りましたので、同じような境遇で「markdownて微妙に書きづらいし読みづらいよなあ」なんて思われている方に共有できれば幸いです。

markdownで改行する

以下の方法があります。

#	記法	結果
1	空行を挿入する	1行改行される。空行を何行作っても1行(段落が変わる)だけ
2	行末に半角スペースを2つ以上記述する	同じ段落内で改行
3	<br>タグを記述する	同じ段落内で改行。複数行の改行ができる

それぞれ記法の違いと用途、結果にも違いがあるので、この機会に使い分けを意識してみようと思いました。

VSCodeにおけるスペースの表示

今回の気づきである「行末に半角スペース」を活用するにあたり、VSCodeの設定を見直してみました。
半角スペースやタブ(whitespace characters)の表示をコントロールする設定は、VSCodeの設定のうち「Editor: Render Whitespace」で変更できます。

VSCodeの公式ドキュメントでは設定のデフォルト値、および選択可能な値と、値の意味を確認することができます。

  // Controls how the editor should render whitespace characters.
  //  - none
  //  - boundary: Render whitespace characters except for single spaces between words.
  //  - selection: Render whitespace characters only on selected text.
  //  - trailing: Render only trailing whitespace characters.
  //  - all
  "editor.renderWhitespace": "selection",

デフォルト値は"selection"、つまりコードや文字を選択しないと表示されないようになっています。これを"all"に変更することで、すべての場合において常に表示させることができます。

設定の変更

(Macの場合)キーボードで「Command + ,」を押すとSettingsが開きます。

Search Settingsにwhitespaceと入力すると、Editor: Render Whitespaceが上から２番目あたりに表示されます。

クリックして値を選択することができます。

比べてみる

"selection"の場合

未選択

選択してみる

"all"の場合

文字を選択しなくても半角スペースを表示してくれています。これで行末の半角スペースを見逃さないようになりました。^[1]

まとめ

読みやすいだけでなく、あとからの書き直しもしやすいドキュメントを心がけたいと思います。

ではまた！

脚注

1. 人によっては常に表示されるスペースやタブ表記をうっとおしいと感じる方もいるかも・・・あくまでお好みの範囲で、いろいろお試しいただければ幸いです。