VSC 코드조각 만들기

비주얼 스튜디오에는 코드 조각

이라는 기능이 있습니다.

영어로는 Code Snippet 이라고 합니다.

 

prefix로 설정한 키를 두어개 누르거나

Ctrl + Space 로 사용할 수 있는

일종의 자동완성 기능입니다.

 

비주얼 스튜디오 코드에서

웹페이지를 작업하시는 분들은

반복이 많은 html 특성상 코드 조각과

자동완성을 매우 빠른 스피드로

사용하는데요. 빠른 손놀림으로

코드가 착착 완성되가는 모습을

보고 있으면 절로 감탄이 나옵니다.

 

이는 모두 인텔리전스에서 제공하는

자동완성, 코드 스니펫, 단축키 등을

효율적으로 사용해야지 가능한 부분입니다.

 

리눅스 시스템을 사용하는 서양쪽

고인물 중에는 emacs 같이 마우스의 사용을

최소화하는 텍스트에디터가 최고다라고

주장하는 이들도 있습니다만,

본인이 사용하는 사용환경에 따라

장단점이 있는게 아닌가 싶습니다.

 

사실 이것은 일종의 기술이기 때문에

자신만의 스타일이란게 생기기 마련입니다.

어떤 방식이 더 좋다 나쁘다를

도매급으로 밀기엔 쪼끔 강요하는 것 같지요.

 

*코드를 작성하다 보면 반복해서

사용하게 되는 코드 조각들이

생기기 마련입니다.

그게 뭐든간에 상관은 없습니다.

자주 쓰냐 안쓰냐가 중요합니다.

 

 

비주얼 스튜디오 코드에서는

인텔리전스의 코드 조각 뿐 아니라

사용자가 직접 코드 조각을

만들 수 있습니다.

 

여기서는 간단하게 C언어 콘솔

프로그램의 스켈레톤 코드를

만들어 보겠습니다.

 

VSC는 단순히 똑같은 코드를

불러오는 것보다 다양한 기능을

제공하기 때문에 생각보다 꽤

쓸만할 겁니다.

 

이 기능에 빠지게 되면 헤어나기

어려운데 특히 타이핑하기 귀찮을때

사용하기 좋습니다.

 

VSC의 메뉴에서,

 

*파일 -> 기본 설정 -> 사용자 코드 조각

 

을 클릭하면 언어 별로 코드 조각을

선택할 수 있고 새로운 코드 조각을

생성할 수 있습니다.

VSC 코드 조각
VSC 코드 조각

언어마다 다른 코드 조각을 사용할 수도

있고 전역적으로 사용할 코드 조각도

만들 수 있습니다.

 

VSC는 기본적으로 빌트인 스니펫에

자바 스크립트 등의 언어를 지원하는데

자신이 사용하는 언어가 없다면

인텔리전스를 설치해 보도록 합니다.

언어를 적용하지 않아도 큰 상관이

없겠지만 VSC가 제공하는 변수와

기능을 좀 더 활용할 수 있을 겁니다.

 

헷갈리면 그냥 전역 코드 조각을

사용하면 됩니다.

(전역은 모든 언어에 적용)

 

json 파일을 편집해보겠습니다.

cmain 이라고 쳤을 때 아래처럼

코드가 나오게 해보겠습니다.

 

중복되지 않으면 cmain의 cm까지만

쳐도 나오기 때문에 두 글자로

아래 코드의 타이핑이 끝납니다.

 

#include<stdio.h>

int main()
{

    /* Start Here */
    int var = 1;
    printf("hello world! %d\n",var);

    return 0;

}

json 파일을 편집하려고 하면 그 안에

사용법이 나와있습니다.

{
	"basic C code":{
		"prefix": "cmain",
		"body": [
			"#include<stdio.h>",
			"",
			"int main()",
			"{\n",
			"\t$BLOCK_COMMENT_START Start Here $BLOCK_COMMENT_END",
			"\tint var = 1;",
			"\tprintf(\"${1:hello world! %d}\\n\",${2:var});",
			"\n\treturn 0;",
			"\n}"
		],
		"description": "basic C code"
	}
}

 

처음 나오는 basic C code는 이름이고

prefix가 코드 조각을 불러오는

키워드 입니다.

 

Ctrl + Space 를 누르고 cmain을

타이핑하면 나옵니다. (그냥도 나옴)

 

body 부분에 코드 템플릿을 작성합니다.

 

여기서는 C언어 콘솔의 기본인

stdio.h 헤더를 인클루드 하고

main 함수를 만들었습니다.

 

$BLOCK_COMMENT_START 이것은

VSC에서 제공하는 변수입니다.

문서를 생성하는 날짜나 시간 등

다양한 변수를 사용할 수 있는데

아래의 VSC 사이트에서 변수의

리스트를 볼 수 있습니다.

 

Snippets in Visual Studio Code

It is easy to add code snippets to Visual Studio Code both for your own use or to share with others on the public Extension Marketplace. TextMate .tmSnippets files are supported.

code.visualstudio.com

\t 등의 이스케이프 시퀀스도

사용할 수 있는데 주의할 점은

문자열 따옴표 "" 안에서 사용하려면

\를 앞에 한번 더 붙여줘서

일반 텍스트로 인식되야 합니다. 

 

${1: text} 을 쓰면 placeholder로

포커스가 되고 tap 키로 placeholde 간에

이동할 수 있습니다.

 

description 은 코드 조각에 대한 설명입니다.

 

body에 사용할 수 있는 여러 변수들이나

문법에 대해서는 VSC 튜토리얼을

참고할 수 있습니다.

 

그럼 작성을 마친 후 저장을 하여

코드 조각을 사용해 보겠습니다.

cm 만 쳤는데 cmain 이 나옵니다.

 

이렇게 해서 사용자 코드 조각을

사용할 수 있습니다.

 

 

Snippets in Visual Studio Code

 

Snippets in Visual Studio Code

It is easy to add code snippets to Visual Studio Code both for your own use or to share with others on the public Extension Marketplace. TextMate .tmSnippets files are supported.

code.visualstudio.com

 

공유하기

facebook twitter kakaoTalk kakaostory naver band