LoginSignup
5
6

More than 3 years have passed since last update.

【VSCode】VSNotesでマークダウン記法と画像貼付をして、万能ノート化する方法

Posted at

導入から設定

image.png

拡張機能で上記をインストールする。

1.Pathの指定

保存するディレクトリを指定します。必須設定です。
Macの場合は、コマンドパレット(Ctrl + Shift + P)を開いて
VSNotes:Run setupをクリックします。

※コマンドパレットが開かないぞ? と言う方は Command + Shift + P を試して下さい。

image.png

VSNotes:Run setupをクリックすると右下に下記が表示されるので
Startをクリックしディレクトリを指定します。
予め、保存する為のディレクトリを作成した置いた方がいいかもしれません。

image.png

以降は、指定したディレクトリに情報が保存されます。

2.Markdownファイルの生成

コマンドパレットを開きVSNotes: Create a New Noteをクリックします。
Tagsとノートのタイトルの順に入力を求めらるので入力します。
後は、マークダウン記法で記載をしていきます。

image.png

プレビューを表示した場合は、コマンドパレットで
Markdownと打ち込めばプレビューを横に表示出来る項目が出てきます。
クリックすると右側にプレビューが表示されます。

左上に表示されているVS Notesの右側に更新ボタンがあるので、
クリックすると記事がFilesに表示されます。

image.png

3.Paste Images 導入

文章だけじゃなくて、画像も貼り付けたいとご要望の方は、
拡張機能Paste Imagesを導入して下さい。

image.png

拡張機能で上記をインストールする。

4.Paste Images 基本操作

1.画像をクリップボードに入れる → Command + Shift + Ctrl+ 4 範囲指定は任意
2.Option + Command + V で任意の場所に貼り付けます。
※画像は同じ階層のディレクトリに保存されます。

image.png

Command + C は? 

Command + Cではクリップボードに画像が入りません。
上記画面右下表示されている文章の通りクリップボードに画像がないよと言われます。
image.png

以上で、導入と基本操作については説明を終了します。
この他にも様々な設定をする事が出来るので、興味のある方は下記の記事をご参考下さい。

参考にさせていただいた記事

VSNotesの設定関係
https://qiita.com/bele_m/items/6115602d361a7c6cbb2c

VSNotesの紹介
https://www.karelie.net/vscode-notes/

Paste Image導入と設定
https://kinacon.hatenablog.com/entry/2019/01/30/Visual_Studio_code_Markdown%E3%81%AB%E7%94%BB%E5%83%8F%E3%82%92%E8%B2%BC%E3%82%8A%E4%BB%98%E3%81%91%E3%82%8B

スクリーンショットを直接クリップボードに保存する方法
https://qiita.com/ThreeTreesLight/items/3b09be6bcc7058ede8ef

5
6
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
5
6