news 2026/4/15 15:47:09

Prettier

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
Prettier

Prettier 是一个自动格式化代码的工具。它的核心工作是重新排版代码,使其符合一致的风格。

可以把它想象成文字处理软件中的“自动排版”功能。当你写一篇文章时,你可能有时段首缩进不一致,有时空行太多,有时列表的对齐不整齐。Prettier 的作用类似,但它处理的对象是编程代码。它不关心代码的逻辑是否正确,只关注代码的“外观”——缩进、换行、空格、引号等,确保它们看起来整洁、统一。

2. Prettier 能做什么

Prettier 能自动将混乱或不一致的代码格式,转换成预先定义好的、统一的格式。

例如,一个团队中,有人习惯在代码行的结尾加逗号,有人不加;有人用双引号表示字符串,有人用单引号;有人把长代码拆成多行,有人写在一行。这些格式差异虽然不影响程序运行,但会让代码库看起来杂乱,在版本对比时也会产生不必要的干扰。

Prettier 接手这份工作。你给它一段代码,它解析代码的结构,然后完全忽略原有的格式,按照它自己的规则重新“漂亮地”打印出来。结果是,所有经过 Prettier 处理的代码,风格都一模一样。这消除了团队内关于代码风格的个人争论,让开发者更专注于逻辑本身。

3. 怎么使用

使用 Prettier 主要有三种常见方式:

第一种是在命令行中单次使用。在项目中安装 Prettier 后,可以通过命令格式化指定的文件或整个目录。这类似于一次性整理房间。

第二种是在代码编辑器中集成插件。这是最高效的方式。安装编辑器插件(如 VSCode 的 Prettier 扩展)后,可以在保存文件时自动格式化当前文件。这就像写字时有个助手,每次你停笔,它就帮你把字迹立刻工整地重写一遍。

第三种是在项目的构建流程中加入检查。通常在团队项目中,会通过 Git 的“预提交钩子”工具,在代码提交前自动运行 Prettier 进行格式化。这相当于在将产品打包出厂前,最后通过一道标准化质检,确保所有产品外观规整。

4. 最佳实践

在项目开始时引入。在一个已有大量代码的项目中直接运行 Prettier,可能会一次性修改成千上万行代码,这会给版本历史记录带来巨大变动,不利于追踪。理想情况是在新项目初期就配置好。

团队统一配置。Prettier 本身提供了一套明智的默认规则,但也允许通过配置文件小幅调整。团队应共同决定并使用同一份配置文件,避免在不同机器上产生不同结果。

与编辑器保存时格式化功能结合。这能保证开发者本地编写的代码即时被格式化,减少了后续集中整理的工作量。

理解其局限性。Prettier 只负责格式,不负责代码质量。它不会发现 bug 或逻辑错误。因此,它通常需要与 ESLint 这类代码质量检查工具配合使用,二者分工合作。

5. 和同类技术对比

最常见的对比是 ESLint。ESLint 是一个强大的代码检查工具,它也能通过规则修复一些格式问题。但它们的侧重点不同:

  • Prettier 专注格式:它的规则是“不可协商的”,目标是把所有格式决策自动化、标准化。你用 Prettier,就接受了它对你代码外观的全面接管。

  • ESLint 专注代码质量与风格:它的规则更广泛,除了格式(如空格使用),还能检查未使用的变量、可能的错误代码模式等。它的许多格式规则是可调节的。

一个生动的比喻是:整理一份书面报告。

  • Prettier就像一位专业的排版员,只负责调整页边距、字体大小、行间距、段落缩进,让报告看起来美观统一。他不关心内容对错。

  • ESLint则像一位严格的校对和内容审查员,他会检查单词拼写、语法错误、事实矛盾,甚至提醒你“这句话的表述风格不符合我们公司的习惯”。

在实际项目中,两者常常一起使用:用 ESLint 检查代码质量和捕捉错误,并禁用其中与格式相关的规则;用 Prettier 全权负责所有代码的格式化工作。它们通过插件可以很好地协同工作,互不冲突,共同提升代码的整洁度和可靠性。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/16 12:34:29

ESLint

好的,我会从资深软件开发专家的视角,为你系统性地梳理ESLint。它早已超越了“代码检查器”的范畴,是现代前端工程化体系中不可或缺的质量基石。下面我们从五个维度来展开。1. ESLint是什么?你可以把它理解为一个针对JavaScript和T…

作者头像 李华
网站建设 2026/3/25 9:30:53

CANN ops-math:面向 AI 计算的基础数学算子开发与高性能调用实战指南

前言 在人工智能系统日益复杂的今天,底层计算效率已成为决定模型训练速度、推理延迟乃至整体用户体验的关键因素。无论是大语言模型中的注意力机制,还是计算机视觉任务中的卷积运算,其本质都可归结为一系列高度结构化的数学操作。这些操作的…

作者头像 李华
网站建设 2026/4/15 23:36:28

CANN ops-math:为上层 AI 算子库提供核心支撑的基础计算模块深度拆解

前言 在现代人工智能系统中,高性能算子是连接算法创新与硬件加速的关键桥梁。无论是大语言模型中的注意力机制、计算机视觉中的卷积操作,还是科学计算中的张量代数,其底层都依赖于一系列高效、稳定、可复用的基础数学计算原语。CANN&#xff…

作者头像 李华
网站建设 2026/4/15 15:31:19

第21届智能车竞赛-智能视觉组规则修改优化

简 介: 本文介绍了第21届智能车竞赛人工智能视觉组比赛规则的三项重要修改:1)统一车模标识牌安装方式,采用磁吸设计并固定高度为15cm;2)将标识牌颜色由黄色改为灰绿色(RGB:90,179,89&#xff09…

作者头像 李华
网站建设 2026/4/16 9:37:12

鼻窦ct检查做什么,多少钱?这个和鼻内镜什么区别

鼻窦CT检查是通过X线断层扫描,清晰呈现鼻腔、鼻窦的骨性结构与软组织形态,核心用于排查鼻窦相关病变。 检查主要作用 1. 明确病变类型 ◦ 诊断鼻窦炎、鼻息肉、鼻中隔偏曲的严重程度,判断鼻窦内是否有积液、炎症或新生物; ◦ 排查鼻窦骨折、先天性发育异常,以及肿瘤等占…

作者头像 李华