Skip to content
| Marketplace
Sign in
Visual Studio Code>Formatters>vue-beautify2New to Visual Studio Code? Get it now.
vue-beautify2

vue-beautify2

keraun

|
110,075 installs
| (2) | Free
Beautify Vue code in place for vscode
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Notice: 原作者不维护了,keruan fork代码优化了一些地方,重新发版vue-beautify2 1.import 格式化不换行

Notice: This project is no longer maintained. 注意:这个项目已经不在维护了

vue-beautify for vscode

Features

Beautify Vue code in Visual Studio Code.

preview

Usage

  1. Keyboard Shortcut: ctrl+shift+f ;
  2. Open context menu in vue, choose Beautify Vue ;
  3. Press F1, search Beautify Vue, and click the item.

Indent Option

The vue-beautify's indent option according to the textEditor's indent option, like this:

indent option

Keyboard Shortcut

Use the following to embed a beautify shortcut in keybindings.json. Replace with your preferred key bindings.

    {
      "key": "ctrl+shift+f",          
      "command": "extension.vueBeautify",
      "when": "editorTextFocus && !editorReadonly" 
    }

Github

https://github.com/peakchen90/vue-beautify

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft