pritter-Code formatter(代码格式化)配置

pritter-Code formatter(代码格式化)配置

---

前言

本篇主要介绍了VS code中自动格式化程序prettier的配置过程。

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、prettier是什么？

prettier是一个代码格式化程序。它通过解析代码并使用自己的规则（考虑最大行长）重新打印代码，从而使得代码样式一致，并在必要时包装代码。prettier配置完成后代码自动格式化，无需手动调整。

二、常见参数说明

参数名	含义	默认值	备注
printWidth	单行代码最大长度	80	最大长度一般设置为100-120
tabWidth	缩进长度	2
semi	末尾是否加分号	true
singleQute	是否使用单引号	false

其他参数配置参考地址：https://prettier.io/docs/en/options.html或者在VS code拓展工具中，找到prettier从下图所示进入。

三、配置步骤

本次配置过程在vs code中进行，并调节semi为false，sigleQute为true。

步骤一：在VS code下载prettier插件

步骤二（第一种方法）：在vs code‘’设置‘‘中进行调参

semi为true表示代码末尾加分号，false表示代码末尾不加分号，通常script标签中的代码末尾不加分号；

sigleQute为true表示使用单引号而非双引号，false表示文档格式化后均为双引号而非单引号。

步骤二（第二种方法）：在vs code‘’settings.json‘‘文件中进行调参

在’‘vs code 配置’‘界面，同时按住’‘shift+ctrl’‘，再按p，搜索settings.json文件，semi和sigleQute参数可在其中进行调整。

步骤三：保存时代码的自动格式化

在vs code '‘设置’'中配置保存时文档代码自动格式化。

步骤四：文档中格式化方式设置

（1）文档中，鼠标右击并点击格式化文档方式。

（2）选择prettier-code formatter为默认方式。

大家看到这里，说明vs code 中prettier配置已完成！保存文档代码即可自动进行格式化，快去试试吧！