VS code Extension 개발 1 (생성)

Hong·2022년 8월 20일
0

VS code Extionsion

목록 보기
1/3

장점

  • 터미널 및 기타 익스텐션에서 할 수 있는 모든 걸 하나의 익스텐션으로 할 수 있다.
  • 기타 툴을 사용하지 않고 VS code 툴 하나만 사용하기 때문에 가볍다.
  • 여러 사람이 사용한다면 VS code의 모든 사용자의 설정을 동일하게 맞출 수 있다.

개발환경

  • Mac

생성

기본적으로 아래 VS code에서 제공하는 익스텐션 가이드이다.

개발해보면서 느낀 결과 한국어로 번역된 정보가 거의 없어 아래 사이트를 많이 참고하였다.

https://code.visualstudio.com/api/get-started/your-first-extension

Extension 프로젝트 생성하기

터미널

npm install -g yo generator-code

yo code

해당 명령어를 입력한 뒤 익스텐션을 프로젝트를 생성한다.

이 때 타입스크립트를 추천하는데

이유는 예제가 대부분 타입스크립트로 되어있어 다른 언어 정보는 거의 찾을 수 없었다.

기타 정보는 언제든 수정 할 수 있다.

vscode로 폴더를 열어 빌드하면 기본적으로 실행할 수 있는 커맨드가 하나있다.

package.json 파일의

"activationEvents": [
		 //커맨드 정의
        "onCommand:blogextension.helloWorld"
	],
	"main": "./dist/extension.js",
	"contributes": {
		"commands": [
			{
	           	//실행커맨드
				"command": "blogextension.helloWorld",
                //메뉴에서 보여줄 이름
				"title": "Hello World"
			}
		]
	},

이 부분이 해당 명령어를 사용하겠다고 정의하는 부분이며

extension.ts 파일의

let disposable = vscode.commands.registerCommand('blogextension.helloWorld', () => {
		// The code you place here will be executed every time your command is executed
		// Display a message box to the user
		vscode.window.showInformationMessage('Hello World from blogExtension!');
	});
	context.subscriptions.push(disposable);

이 부분이 해당 커맨드가 실행할 코드라고 할 수 있다.

profile
게임 개발자

0개의 댓글