Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>pe-configuration-editorNew to Visual Studio Code? Get it now.
pe-configuration-editor

pe-configuration-editor

PengHe2025

|
5 installs
| (0) | Free
A hello world sample extension to demonstrate using Angular with the Webview UI Toolkit for VS Code.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Hello World (Angular)

This is an implementation of the default Hello World sample extension that demonstrates how to set up and use a Angular + Webview UI Toolkit webview extension.

Documentation

For a deeper dive into how this sample works, read the guides below.

Run The Sample

# Copy sample extension locally
npx degit microsoft/vscode-webview-ui-toolkit-samples/frameworks/hello-world-angular hello-world

# Navigate into sample directory
cd hello-world

# Install dependencies for both the extension and webview UI source code
npm run install:all

# Build webview UI source code
npm run build:webview

# Open sample in VS Code
code .

Once the sample is open inside VS Code you can run the extension by doing the following:

  1. Press F5 to open a new Extension Development Host window
  2. Inside the host window, open the command palette (Ctrl+Shift+P or Cmd+Shift+P on Mac) and type Hello World (Angular): Show
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft