前端工具 prettier 来美化格式化你的代码

小渣渣

Prettier 是一款功能强大的代码格式化程序，支持：

• JavaScript (包括实验性功能)
• JSX
• Angular
• Vue
• Flow
• TypeScript
• CSS, Less, and SCSS
• HTML
• Ember/Handlebars
• JSON
• GraphQL
• Markdown, including GFM and MDX v1
• YAML
  

功能：Prettier 可以在编辑器中保存时、预提交挂钩中或在CI 环境中运行，以确保您的代码库具有一致的风格，而无需开发人员再需要在代码审查中发布挑剔的评论！

文档：超链接登录可见。
GitHub 地址：超链接登录可见。

在 Node 项目中使用 npm 命令安装 prettier，命令如下：

登录可见。

在项目根目录下新建两个文件：

.prettierignore：忽略的文件或者文件夹，意思就是那些内容不允许 prettier 进行格式化。参考：超链接登录可见。
.prettierrc：配置文件，以 JSON 或 YAML 编写的文件。参考：超链接登录可见。



本文以 Angular 18 项目为例，在项目目录新建了两个文件配置分别如下。

.prettierignore 内容如下：

登录可见。

.prettierrc 内容如下：

登录可见。

在 package.json 文件下的 scripts 增加如下配置：

登录可见。

测试格式化代码，命令如下：

登录可见。

效果如下图：



（完）