vscode中prettier插件怎么使用

vscode中prettier插件怎么使用

想在VS Code里让代码自动变得整洁漂亮？Prettier插件绝对是你的得力助手。如果还没安装，操作很简单：点击侧边栏的“Extension”图标，在搜索框里输入“prettier”，找到那个官方的、下载量最高的插件，点击安装即可。

光说不练假把式，我们准备一段“素材”。下面这张图里的HTML代码，格式就有些随心所欲了，缩进不一致，结构看起来也不够清晰，正是Prettier大显身手的好对象。

接下来是关键步骤。在你打开这段代码的编辑器窗口里，按下快捷键“CTRL + Shift + P”召唤出命令面板。这时候，输入“format”这个关键词，你会看到两个核心选项浮出水面：

1. **Format Document** （快捷键 Shift+Alt+F）—— 顾名思义，它会帮你整理整个文档。

2. **Format Selection** （快捷键 Ctrl+K, Ctrl+F）—— 这个更灵活，只格式化你选中的那部分代码。

根据你的需要，任选其一就行。

这里我们选择“Format Document”。一瞬间的事，代码就改头换面了。对比一下下图，之前杂乱无章的代码现在层次分明、缩进统一，阅读体验提升了不止一个档次。

除了命令面板，还有个更直观的方法。你可以直接选中代码，然后点击右键，在右键菜单里同样能找到那两个熟悉的选择：“Format Document”和“Format Selection”。这对于习惯鼠标操作的朋友来说，确实方便了不少。