当前位置:数智频道首页 > 攻略 > 正文

vscode中prettier插件怎么使用

vscode软件中,丰富的插件大家可以使用。这里为大家带来关于prettier插件怎么使用的详细步骤分享,想了解的小伙伴快一起来看看下面的介绍吧!

vscode中prettier插件怎么使用

打开vscode,如果没有安装prettier插件,请先安装,安装方法是点击“Extension”图标,然后搜索 “prettier”,找到官方插件并安装

vscode中prettier插件怎么使用

准备一段示例代码,如下图是一段格式比较混乱的html代码

vscode中prettier插件怎么使用

在打开示例代码的vscode窗口中,使用快捷键“CTRL + Shift + P”打开vscode命令框,在框中输入“format”关键字,可以看到有2个选项

1. Format Document (快捷键 Shift+Alt+F)对整个文档做格式化

2. Format Selection (快捷键Ctrl+K, Ctrl+F)对选择代码做格式化

可以根据需要选择其中一个选项

vscode中prettier插件怎么使用

我们选择“Format Document”后,可以看到代码发生了变化,示例代码变得美观整洁,如下图所示

vscode中prettier插件怎么使用

另外,我们还可以选中部分代码,然后点击右键,在右键菜单中也会有2个选项,同样可以对现有代码做格式化,用起来很方便

1. Format Document

2. Format Selection

vscode中prettier插件怎么使用

热点推送

本周关注

MORE