typespec-vscode

TypeSpec Extension in Visual Studio Code

Repository | Documentation | Issues | Samples

The TypeSpec extension for Visual Studio Code enhances the development of TypeSpec by leveraging VS Code's powerful features. It provides:

• IntelliSense and syntax highlighting
• Code autocompletion and formatting
• Live diagnostics and quick fixes
• Refactoring tools (rename, go-to definition, etc.)
• Seamless project setup and emitter configuration
• Generate code from TypeSpec

Prerequisites

Before using the TypeSpec extension, install Node.js and verify npm is available:

npm --version

Other necessary installations will be prompted within the extension as needed.

Features

Writing TypeSpec

• IntelliSense & Auto-completion: Code faster with smart suggestions.
• Code Formatting & Folding: Keep your code clean and organized with built-in formatting and folding support.
• Syntax Highlighting: Clear and readable TypeSpec syntax.
• Live Diagnostics: Get real-time feedback on code issues.
• Quick Fixes & Refactoring: Rename, go-to definition, and format with ease.
• Hover Info: Get detailed information about TypeSpec elements by hovering over them.

Project Initialization

• Create TypeSpec Project: Easily initialize a new TypeSpec project based on a template, ensuring a structured and ready-to-use setup.

Generating Code from TypeSpec

The extension allows generating various outputs from TypeSpec:

• OpenAPI Specification
• Server SDKs: Generate server stubs for different back-end frameworks.
• Client SDKs: Generate client code for multiple languages, including:
  • .NET (C#)
  • Python
  • Java
  • JavaScript/TypeScript

Invoke TypeSpec: Generate From TypeSpec to generate code:

Commands

The extension provides the following commands:

Command	Description
TypeSpec: Create TypeSpec Project	Scaffold a new TypeSpec project.
TypeSpec: Install TypeSpec Compiler/CLI globally	Install the TypeSpec Compiler/CLI globally.
TypeSpec: Generate From TypeSpec	Compile and generate from TypeSpec files into the specified output.
TypeSpec: Restart TypeSpec Server	Restart the TypeSpec language server.
TypeSpec: Show Output Channel	Open the TypeSpec output channel to view logs.

Configuration

TypeSpec will interpolate a few variables using this pattern ${<name>}. For example ${workspaceFolder}.

Available variables:

• workspaceFolder: Correspond to the root of your Visual Studio workspace.

typespec.tsp-server.path: Configure the server path

There are cases where the TypeSpec project is located in a subfolder. In such cases, the TypeSpec extension is not able to find the tsp compiler automatically and needs a little guidance. This setting provides the ability to configure where the tsp compiler is located.

{
  "typespec.tsp-server.path": "${workspaceFolder}/my-nested-project/node_modules/@typespec/compiler"
}

Telemetry

The TypeSpec Extension for Visual Studio Code collects usage data and sends it to Microsoft to help improve our products and services. Read our privacy statement to learn more. This extension respects the telemetry.telemetryLevel setting which you can find more information in the FAQ.