본문 바로가기

IT/MacOs, 맥북

마크다운 편집기로서의 Visual Code 사용기

macOS에서 마크다운 편집기로서의 Visual Code 사용기

다양한 종류의 마크다운 편집기들이 있습니다. 주로 ByWord를 사용하였습니다. 문서를 작성을 하다보면 화면을 캡춰하여 그림파일로 저정하고 다시 해당 그림을 마크다운 문서에 링크로 거는 작업을 반복적으로 수행하게됩니다.

상당히 시간이 소요되는 귀찮은 작업입니다. 그래서 클립보드에 캡춰된 그림을 붙여 넣기하여 사용할 수 있는 마크다운 에디터를 찾아보았습니다. Bear라는 편집기가 그림을 붙여넣기가 가능하지만 삽입된 그림의 경로가 마음대로 설정할수가 없습니다. 원하는 시나리오는 다음과 같습니다.

  1. 그림을 클립보드로 복사합니다.
  2. 마크다운 에디터에 붙여넣기합니다.
  3. 해당 그림은 자동으로 지정된 장소에 저장되어야 합니다.

해당 기능을 완벽히 지원하는 에디터를 찾을 수 없습니다. 머리속에 떠오른 아이디어는 Visual Source Code 입니다. 마이크로소프트에서 무료로 제공하는 에디터로서 수많은 익스텐션들이 사용기능을 풍요롭게합니다.

혹시 상기의 기능을 지원하는 익스텐션이 있는지 검색해보니 Paste Image라는 것이 상기의 기능을 정확하게 지원합니다.

그럼 Visual Source Code를 이용하여 마크다운 문서를 작성하기를 소개합니다.

Visual Source Code

Visual Source Code는 https://code.visualstudio.com/download에서 다운로드 받습니다.

마크다운 미리보기 익스텐션과 Paste Image익스텐션 설치

메뉴에서 보기 > 확장을 선택 또는 좌측 메뉴에서 마지막 다섯번째 아이콘을 클릭하면 익스텐션 검색창이 나타납니다.
extension

검색창에서 markdown을 입력하고 Auto-Open Markdown Preview의 "설치" 버튼을 클릭합니다.

Paste Image 익스텐션도 검색하여 설치합니다.

추가로 Word Count 익스텐션도 설치합니다. 문서에 단어 갯수를 보여줍니다.

Paste Image 사용

일단 원하는 경로를 설정을 하겠습니다. 코드 > 기본설정 > 설정 또는 command + , 를 입력합니다. 그리고 .images 폴더에 저장되도록 설정을 추가합니다.

"pasteImage.Path":"./images"

settingj

그러면 그림을 붙여넣기 (command + option + v) 하면 자동으로 다음과 같이 그림이 images 폴더에 저장됩니다.

paste image

저장되는 이미지 파일명을 지정하려면 파일명을 마크다운 문서에 넣고 블럭지정한 후에 이미지를 붙여넣기를 합니다.