Sublime Text에 markdown 설치하기

Posted on 2021-08-30 by GKSRUDTN99
MacOS Sublime Text Mac Markdown

Sublime Text에 Package Control 설치

Cmd+Shift+p 를 이용해 Command Palette를 열고, Install Package Control 을 입력해 설치한다.


Markdown Editing, Markdown Preview Package 설치

Cmd+Shift+p를 입력 후 Package Control: Install Package를 입력한다.

이어서 나오는 창에서 markdown editing입력 후 엔터를 입력하면, 에디터가 설치된다.

같은 방식으로, markdown preview도 설치할 수 있다.


Markdown Preview의 Setting 수정

Sublime Text -> Preferences -> Package Settings -> Markdown Preview -> Settings을 눌러 나오는 창에서 Settings - User에 아래의 내용을 추가한다.

{
    "browser": "/Applications/Google Chrome.app", 
    "enable_autoreload": true
}

다음으로, Sublime Text -> Preferences -> Key Bindings를 눌러 나오는 창에서 Default (OSX).sublime-keymap - User에 아래의 내용을 추가한다. (super = cmd 키)

[
    {...},
    {
        "keys": ["super+m"],
        "command": "markdown_preview",
        "args": {"target": "browser", "parser": "github"}
    }
]

이상의 설정을 마친 뒤, 새로운 .md 형식의 파일을 만들어 저장하여 문서를 작성한 뒤, Cmd+m을 눌러 프리뷰가 뜨는지 확인한다.


LiveReload 패키지 설치

.md 파일의 내용을 수정하여 프리뷰를 띄운 뒤, 파일의 내용을 수정하고 저장하면 프리뷰를 새로고침 하였을 때 해당 내용이 반영이 되도록 하는 패키지이다.

위에서 에디터와 프리뷰를 설치하는 것과 동일한 과정으로 LiveReload패키지를 설치한다.

Sublime Text -> Preferences -> Package Settings -> LiveReload -> Setting - User에 아래의 내용을 추가한다.

{
    "enabled_plugins": [
        "SimpleReloadPlugin",
        "SimpleRefresh"
    ]
}

https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei?hl=ko

위 링크에 접속하여 Chrome 확장 프로그램을 설치한 뒤, LiveReload가 정상 작동하는지 확인한다.


문서 작성을 완료 한 뒤 옮기는 방법

Markdown 형식으로 글 작성

Cmd+Shift+P 입력 후 Markdown Preview: Export HTML in Sublime Text선택

github 선택

sublime text 창에 html 코드 창이 새롭게 생성되면,

...
영역만 복사하여 HTML 코드에 붙여넣으면 됨


여담 : 맥 에서의 backquote는 입력 언어가 영어로 설정되어 있어야 정상적으로 입력된다.