* 본 글은 iMac 환경 중심으로 작성 했으나 스니펫 설정은 윈도우 환경에서도 별다른 차이가 없을 것으로 생각합니다. *
sublime text 3 실행 후, 상단 Tool 메뉴 > Developer > New Sinppet
상단은 New Snippet을 열었을 때 처음 나오는 화면.
서브라임 텍스트의 스니펫에 대한 기본 원리는 아래와 같다.
'단축키(하단에 있는 tabTrigger 태그 안에 있는 단축키)를 누를 때 content 태그 안에 설정된 내용이 나온다.
scope태그 안에 있는 '파일명.확장자'는 해당 내용의 알맞은 파일명.확장자를 말한다.'
<content><![CDATA[Hello, ${1:this} is a ${2:snippet}.]]></content>
밑줄로 기울어진 곳에 나오게 할 내용을 입력한다.
<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
<tabTrigger>hello</tabTrigger>
단축키와 같은 역할을 한다. 밑줄로 기울어진 곳에 해당 내용이 입력되도록 할 단축키를 설정한다.
<!-- Optional: Set a scope to limit where the snippet will trigger -->
<scope>source.python</scope>
해당 내용의 알맞은 확장자를 입력한다.
ex) text.html
scope 태그 안에 들어갈 확장자에 대한 정리는 https://gist.github.com/J2TeaM/a54bafb082f90c0f20c9 에 자세히 나와 있다.
'TOOL' 카테고리의 다른 글
[wordpress] 시작하기(apm setting in Linux) (0) | 2018.09.11 |
---|---|
[Dreamweaver CC] 드림위버로 이미지맵 작업하기 (0) | 2018.07.24 |
모바일 디자인 시 참고할 만한 포스팅 및 템플릿 (0) | 2017.12.26 |
bem과 oocss를 혼합 사용한 airbnb의 css (0) | 2017.12.16 |
기획, 디자인, 퍼블을 동시에 끝낼 수 있는 툴 (0) | 2017.11.21 |