VS Code 플러그인 개발 개요

freeFree Technical Resource

This content is free to read, suitable for basic learning and search traffic.

VS Code 플러그인 개발 개요

서 문 .

VS Code 는 개발 자의 코드 개발 도구 로서 점점 더 개발 자들의 사랑을 받고 있습니다 .내 주변의 프 런 트 엔 드와 마찬가지로 매일 개발 작업 의 80 % 가 VS Code 에서 수행 됩니다 .사람들이 그것을 사용 함에 따라 , 더 이상 간단 하고 우 아 하고 편안 한 코드를 작성 하는 기본적인 필요 를 충족 시키지 못합니다 .어떤 사람들은 그것을 사용하여 낚 시 , 소설 을 읽고 , 주 식을 확인 하고 , 기 사를 읽고 , 바 둑 을 치 고 있습니다 . VS Code 의 플 러 그 인 시장 에 낚 시 두 단어를 입력 하면 선택할 수있는 20 개 이상의 플 러 그 인이 있습니다 .이 게시 물은 VS Code 의 기능을 개 괄 적으로 설명 하고 플 러 그 인 문서 의 인 덱 스를 신속하게 구축 하는 데 도움이됩니다 .

플 러 그 인 기능

플 러 그 인은 다음과 같은 기능을 제공합니다 .

  • 다양한 파일 의 아이 콘 및 테 마 색 상 사용자 정의
  • 사용자 구성 요소 및 UI 추가
  • HTML 을 사용하여 기능 이 풍부한 웹 뷰 만들기
  • 새로운 프로그래밍 언어 지원
  • 특수 디 버 깅 수단 지원

구성 요소 의 주요 모듈

사례 대 집 합

插件的官方案例大集合

각 플 러 그 인의 디 렉 토 리는 대략 동일 하며 , 이는 또한 공식 적인 표준 플 러 그 인 디 렉 토 리 입니다 .

케 이스

VS Code 플러그인 개발 개요Figure

UI 구성 요소

vs code 는 매우 표준 UI 를 제공 하며 , 아이 콘 크 기가 16 * 16 인 sv g 파일 과 같은 플 러 그 인을 만들 때 요구 사항을 엄격 하게 준수 해야합니다 .

다음은 공식 UI 영역 분 할 입니다 .

VS Code 플러그인 개발 개요Figure1
VS Code 플러그인 개발 개요Figure2

명령 행 도구

yo

에 따라

# 의존 성 설치
n pm install - g yo generator - code
yo code # 새 프로젝트 만들기

버튼 위치

플 러 그 인을 사용하여 v s code 에 다양한 위치 에서 많은 사용자 정의 버튼 을 주 입 할 수 있습니다 . vscodeサポート的位置包括这些

로 컬 구성 요소 개발 단계

로 컬 개발 의 단계는 간단 합니다 .

# 의존 성 설치
n pm install - g yo generator - code
yo code # 새 프로젝트 만들기

사례 2

VS Code 플러그인 개발 개요Figure3

종 속 성을 설치 한 후 F 5 키 를 누 르 면 디 버 깅 에 사용되는 새 창 이 열 립니다 .코드를 수정 한 후 다시 로 드가 적용 됩니다 .

Published

n pm install - g @ v s code / v s ce

vs ce 패키 지

vsce login >

vs ce 게시

When 조건

버튼 을 주 입 할 때 때로는 특정 조건 판단 이 필요합니다 . 예를 들어 , 현재 어떤 종류의 파 일이 열려 있을 때 만 특정 버튼 이 표시 됩니다 . 这些判断条件的编写应该遵循以下这个ドキュメント

插件的概览 指导

编写组件的业务逻辑能够使用的VS code api

Put this resource to use in a real project?

Go to the Tool Center for message parsing, CRC verification and device debugging, or submit your requirements for selection and integration advice.

Engineer Membership

Turn this article into actionable debugging resources

After activation, you can use advanced message parsing, resource pack downloads, code examples, engineering cases and priority technical support, suitable for real project delivery.

Unlimited Advanced Tools
Resource & Code Packs
Complete Engineering Case Library
Priority Technical Support

Leave a Reply

Your email address will not be published. Required fields are marked *.