VS Code Extension 만들기

Code 2021. 4. 13. 18:10

VS Code Extension 만들기

    - Visual Studio Code 확장 프로그램 제작 방법



* 필요

Node.js : https://nodejs.org/ko/

Git : https://git-scm.com/

Yeoman : https://yeoman.io/learning/index.html

VS Code Extension Generator : https://github.com/Microsoft/vscode-generator-code



* 설치 : Yeoman, VS Code Extension Generator

> npm install -g yo generator-code



//----------------------------

* 프로젝트 생성

> yo code



    - 생성된 프로젝트를 VS Code로 열기

> code ./helloworld



//----------------------------

* 테스트

    - /.vscode/launch.json

    {

      // Use IntelliSense to learn about possible attributes.

      // Hover to view descriptions of existing attributes.

      // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387

      "version": "0.2.0",

      "configurations": [

        {

          "name": "Run Extension",

          "type": "extensionHost",

          "request": "launch",

          "args": ["--extensionDevelopmentPath=${workspaceFolder}"]

        },

        {

          "name": "Extension Tests",

          "type": "extensionHost",

          "request": "launch",

          "args": [

            "--extensionDevelopmentPath=${workspaceFolder}",

            "--extensionTestsPath=${workspaceFolder}/test/index"

          ]

        }

      ]

    }



    - Extension Development Host 창 띄우기

VS Code 창에서 F5 키 -> VS Code Extension Development 선택

 

    - Extension Development Host 창이 뜨면

    - Command Palette (Ctrl+Shift+P) 에서 Hello World 치기

 

Hello World from HelloWorld! 메시지가 알림 팝업으로 나오면 성공

 

명령어 'Hello World'는 package.json파일의 "title"

"contributes": {

        "commands": [

            {

                "title": "Hello World1" <=== 명령어





//----------------------------

* 메시지 변경

    - extension.ts 파일 수정






//---------------------------

* Publish

 

* 패키징 툴 설치

> npm install -g vsce



* package.json  파일 수정

    publisher , icon 항목 작성

    - 추가 수정 : name, displayName, description , version, publisherDisplayName



* README.md 파일 새로 작성

    - 처음 생성된 파일로 vsce package 시도 하면 다음 에러

 ERROR  Make sure to edit the README.md file before you package or publish your extension.



* 패키지 만들기(*.vsix)

> vsce package



* 패키지(*.vsix) 설치

    - VS Code 실행 -> View -> Extensions (Ctrl+Shift+X)

        -> [...] 메뉴 (View and More Actions) 

        -> Install from VSIX 

        -> 패키지 파일 선택






//----------------------------------

// 참고

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





반응형

'Code' 카테고리의 다른 글

VS Code 포매터 지정 방법  (0) 2021.04.13
VS Code Extension 만들기  (0) 2021.04.13
Git Client (GUI)리스트  (0) 2021.03.29
Go 언어  (0) 2021.03.06
7z 단일 실행 파일 명령행 사용 방법  (0) 2021.01.26
[음성인식] DeepSpeech 사용법  (0) 2021.01.18
Posted by codens codens

댓글을 달아 주세요

       


반응형