Visual Studio Code中prettier插件如何使用
来源:互联网
时间:2026-08-02 09:01:21
在VS Code的生态里,Prettier几乎是格式化代码的标配工具。它能让你的代码风格整齐划一,可读性也上了一个台阶。具体怎么用?下面拆开来说。
安装Prettier插件
打开VS Code,点击左侧菜单栏的“扩展”图标。在搜索框里输入“prettier”,找到“Prettier - Code formatter”这个插件,点击安装按钮。装完之后重启一下VS Code,就算就绪了。
配置Prettier
安装完成后,你可以根据自己的偏好来调整格式化规则。调出命令面板(快捷键Ctrl+Shift+P),输入“Prettier: Config”,选择“Edit Prettier Configuration”就会打开一个配置文件(通常是.prettierrc或.prettierrc.json)。在这个文件里,你能设置缩进风格、换行符、单引号还是双引号等等选项。举个例子,把singleQuote设为true,代码里就会统一使用单引号。
使用Prettier格式化代码
格式化单个文件
Alt+Shift+F(Windows/Linux)或Option+Shift+F(Mac),VS Code就会按配置自动格式化。
格式化整个项目
npx prettier --write .。这里的.代表当前目录及其子目录,Prettier会遍历并格式化项目中所有支持的代码文件。
与其他插件配合使用
Prettier可以和很多插件搭配,让开发体验更顺畅。比如ESLint,两者集成后,在编写代码时能实时检查语法和格式规范。当你保存文件时,如果代码有问题,VS Code会同时显示ESLint和Prettier的报错提示,方便你及时修正。
通过以上几步,你就能在VS Code里轻松用Prettier统一代码风格,既提升了可读性,也能让团队协作更省心。