Visual Code Extension Development


VS Code is slowly closing the gap between a text editor and an integrated development environment (IDE). At the core of this extremely versatile and flexible tool lies a wonderful API that provides an extensible plugin model that is relatively easy for JavaScript developers to build on.

This course covers the Visual Code Extension Capabilities. The course offers high-level overviews of what extension can do and How to do it.

Module 1: VS Code Extension Overview 

  • VS Code User Interface Overview
  • Why you should create an extension
  • What an extension can do
  • Activation Events
  • Contribution Points (package.json)
  • Your First Extension

Module 2: VS Code Common Capabilities 

  • Command
  • Configuration
  • Keybinding
  • Context Menu
  • Data Storage
  • Display Notifications
  • Quick Pick
  • File Picker
  • Output Channel
  • Progress API
  • Status Bar Item

Module 3: VS Code TreeView API 

  • View Container
  • Tree View
  • View Action
  • TreeDataProvider API

Module 3: VS Code Webview API 

  • Should I use a webview?
  • Webviews API basics
  • Updating webview content
  • Webview Lifecycle
  • Inspecting and debugging webviews
  • Loading local content
  • Scripts and message passing
  • Security
  • Persistence

Module 4: Language Extension Guidelines

When you hear about a language being supported in Visual Studio Code, you usually think first of syntax highlighting, code completion, and if applicable, debugging support. This is a good start, but language extensions can do a lot more. 

  • Configuration Based Language Support
  • Syntax Highlighting
  • Source Code Snippets
  • Programmatic Language Support
  • Show Hovers
  • Show Code Completion Proposals
  • Provide Diagnostics
  • Help With Function and Method Signatures
  • Show Definitions of a Symbol
  • Find All References to a Symbol
  • Highlight All Occurrences of a Symbol in a Document
  • Show all Symbol Definitions Within a Document
  • Show all Symbol Definitions in Folder
  • Possible Actions on Errors or Warnings
  • CodeLens – Show Actionable Context Information Within Source Code
  • Format Source Code in an Editor
  • Format the Selected Lines in an Editor
  • Incrementally Format Code as the User Types
  • Show Color Decorators

Module 5: Publishing Extensions 

  • vsce – Publishing tool reference
  • Installation
  • Usage
  • Publishing extensions
  • Auto-incrementing the extension version
  • Unpublishing extensions
  • Packaging extensions

סגור לתגובות.

%d בלוגרים אהבו את זה: