Skip to content

What do you think about Visual Studio Marketplace? We are looking for feedback from developers like you! Take the survey

| Marketplace
Sign in
Visual Studio Code>Other>Web PreviewNew to Visual Studio Code? Get it now.

Web Preview

Jabed Hossain

|
649 installs
| (1) | Free
Live Web Preview for local web development in vscode like react, tailwindcss
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

VScode Web Preview

This is not a live-server it's live-preview. You can use any local server http://localhost:3000.

Keyboard Shortcuts

ctrl+shift+p command Preview Open and Preview Url

ctrl+alt+p Open Preview and ctrl+alt+u Open Preview Url inpub box.

Live preview in vscode

Demo

Set default screen size and url in settings.json

    "webPreview.url": "http://localhost:3000",
    "webPreview.mediaScreenOverride": true, // Override default screen object
    "webPreview.mediaScreen": {
        "Mobile": "380x796", // width and height
        "Tablet": 768,       // width
        "Laptop": 1024, 
    }
  • Contact us
  • Jobs
  • Privacy
  • Terms of use
  • Trademarks
© 2023 Microsoft