snippet in vscode

이 글은 vscode 에서 스니펫(snippet) 기능을 다룬다.

스니펫이란 재사용 가능한 소스 코드를 의미한다.

즉, 자주 쓰는 코드를 저장해두고, 필요할 때마다 별칭을 통해 불러올 수 있다.

공식 문서 - https://code.visualstudio.com/docs/editor/userdefinedsnippets

 

예를 들어 상당히 자주 쓰지만, 매번 타이핑 하기가 귀찮다.

그래서 코드 패턴을 저장해놨다가, 매번 단어를 통해 불러오면 개발 환경에 있어, 많은 도움을 준다.

 

크게 직접 스니펫 코드를 만들 수도 있고, 플러그인을 통해 만들 수도 있다.

플러그인을 통해 쉽게 만들고, 그것을 쉽게 커스텀하는 것이 효율적이다.

 

본인은 띄어쓰기 등 조금 번거로울 수 있기 때문에 위와 같은 코드를 만들어주는 플러그인을 이용한다. 

snippet-creator - https://marketplace.visualstudio.com/items?itemName=nikitaKunevich.snippet-creator

 

 

마켓 플레이스에서 설치한 후, 다음과 같이 사용할 수 있다.

 

1. 원하는 코드를 블록 지정한다.
2. create snippet 명령어를 실행 후 스니펫 관련 설정을 입력한 후, 생성한다.

 

 

 

그 후, 설정한 스니펫 이름을 입력한 후, Enter 입력 시 설정했던 코드들을 불러온다.

 

스니펫은 JSON 형태로 포맷된다.

그렇기에 환경 설정에서 사용자 코드 조각을 들어가서 본인이 설정한 파일은 json 형태로 존재한다.

작동이 되지 않는다면 위 경로를 통해 json 파일을 참고하면 된다.

또한 수정 시 json 파일을 커스텀하면 된다.

 

사용자 설정을 통해 tab 키를 활용해 스니펫 기능을 사용할 수 있다.

 

환경설정 - 사용자 설정

"editor.tabCompletion": true

출처: https://mygumi.tistory.com/268 [마이구미의 HelloWorld]