• 为什么我喜欢使用Biome平替 ESLint 和 Prettier?
  • 发布于 1周前
  • 80 热度
    0 评论
作为一名前端开发人员,您对 ESLint 和 Prettier 一定不陌生,经过长时间的发展,它们已成为前端工程化中的重要工具。Prettier 通过自动化和标准化代码格式,让人们专注于逻辑和功能,而不是代码的美观。而 ESLint 是一款功能强大的 JS 检查工具,它旨在识别和报告代码中的语法错误、样式问题和不良做法,从而帮助在项目中保持质量标准和一致性。

为什么想写这个话题,主要归因于现在 ESLint v9.0.0 版本的重大更新及破坏性更改 带来的升级成本,还有在项目中同时使用 ESLint 和 Prettier 出现部分规则和代码格式冲突的问题。下面来详细介绍 Biome。

Biome 基本介绍

Biome 是 Rome 的一个分叉,Rome 原本是一个用 Rust 编写的雄心勃勃的工具,但在 2023 年 10 月被放弃。它同时包含了代码检查器和格式化器,解决了协调 ESLint 和 Prettier 规则所带来的耗时困难。

Biome 被称为下一代代码格式化和检查工具,它基于 Rust 开发,堪称是 ESLint 与 Prettier 的完美结合,它为开发者提供了极致的便捷与高效,让日常代码开发变得更加轻松、流畅。Biome 的运行速度更快,生成的格式更一致、更可预测。它的错误信息也更详细、更有帮助,更容易识别和纠正格式化问题。

Biome 的主要特性
🚀 良好性能:Biome 基于 Rust 编程语言构建,性能卓越。根据基准测试,在 MacBook Pro M1 上,它的格式化速度比 Prettier 快 25 倍,比 ESLint 快 15 倍。
😄 安装简单:只需安装一个依赖项,即可替代 ESLint、Prettier 和几个正常运行所需的插件。
👏🏻 配置快捷:Biome 不需要复杂的配置,开发人员无需进行大量设置即可立即开始使用。不过,它还提供了大量选项,可根据个人喜好对其行为进行微调。
🎉 可扩展性:Biome 可处理任何规模的项目,无论代码库的复杂程度如何,都能确保性能保持一致。
😄 IDE集成:Biome 可与 VS Code 和 IntelliJ IDEA 等流行的集成开发环境和代码编辑器无缝集成。它还通过插件和钩子提供可扩展性。
❎ 错误报告和诊断:Biome 提供详细的上下文错误信息,引导开发人员快速识别和解决问题。
🎉 TS支持:原生支持 TypeScript。
Biome 快速上手
npm install --save-dev --save-exact @biomejs/biome
npx @biomejs/biome format --write ./src
输出格式优化:

Biome 最新动态
Biome 刚刚发布了 v1.7 版本,新版本提供了从 ESLint 和 Prettier 移植的简便路径。它还为格式化器和检查器引入了实验性的机器可读报告、新的linter规则以及许多修复。
快速更新:
npm install --save-dev --save-exact @biomejs/biome@latest
npx @biomejs/biome migrate
1)使用单个命令从 ESLint 快速集成:
biome migrate eslint
该命令将读取 ESLint 配置,并尝试将其设置移植到 Biome。该子命令能够处理传统配置文件和平面配置文件。它支持传统配置的 extends 字段,并加载共享和插件配置!该子命令还能迁移 .eslintignore 文件。

2)使用单个命令从 Perttier 快速集成:
在 Biome v1.7 中,添加了对 Prettier 重载的支持,并尝试将 .prettierignore glob 模式转换为 Biome 支持的 glob。

在迁移过程中,Prettier 的覆盖会转换为 Biome 的覆盖。

最后
如果你也对 Biome 感兴趣,可以尝试在项目中使用。
用户评论