VS Code 플러그인 개발 개요

서 문 .

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

플 러 그 인 기능

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

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

구성 요소 의 주요 모듈

사례 대 집 합

插件的官方案例大集合

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

케 이스

UI 구성 요소

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

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

명령 행 도구

yo

에 따라

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

버튼 위치

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

로 컬 구성 요소 개발 단계

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

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

사례 2

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

发布

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

vs ce 패키 지

vsce login >

vs ce 게시

When 조건

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

插件的概览 指导

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