LoginSignup
2
2

MarkdownをVSCodeで編集する際のオススメ拡張機能

Last updated at Posted at 2022-01-18

おすすめ拡張機能

  • Markdown All in One
    色んな機能が入っている
    TableのFormatも行ってくれる

  • markdownlint
    割かし厳しめのLinterなので、いちいち警告が表示されて鬱陶しい場合もあるが、
    Markdownを雑に書いてしまうと、GitLabに上げたりPDFに変換したりした際に表示が崩れてしまうことがよくあるので、
    Markdownの書式に則って綺麗に書いた方がトータルでは良いと思う

  • Markdown Table
    テーブルを良い感じにFormatしてくれる
    日本語の文字列を含む場合はVSCodeのフォントを等幅フォントにしておけば、表示がズレない

設定例

.vscode/setting.json
{
    "editor.fontFamily": "BIZ UDゴシック",
    "editor.formatOnType": true,
    "editor.formatOnSave": true,
    "[markdown]": {
        "editor.defaultFormatter": "yzhang.markdown-all-in-one"
    },
    "editor.codeActionsOnSave": {
        "source.fixAll.markdownlint": true,
    },
    "markdown.copyFiles.destination": {
        "*": "images/${documentBaseName}/"
      }
}

追記

以前は Paste Image というクリップボードの画像をMarkdownにそのまま貼り付けられる拡張機能も載せていたんですが、
VSCodeのアップデートで類似機能が標準搭載されたため、不要になりました。
"markdown.copyFiles.destination" がその設定項目となります。
設定例を詳しく知りたい人は
https://code.visualstudio.com/updates/v1_79#_copy-external-media-files-into-workspace-on-drop-or-paste-for-markdown
を見てください。

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2