首页 > web前端 > js教程 > Biome.js,一个用于格式化和检查 Web 项目的工具链

Biome.js,一个用于格式化和检查 Web 项目的工具链

Patricia Arquette
发布: 2024-12-03 00:43:10
原创
438 人浏览过

我发现 t3-env 使用 Biomejs 进行 linting 目的。本文概述了 Biomejs 以及 t3-env 中的用法。

Biome.js

Biome.js 是一个适用于您的 Web 项目的工具链。它有助于格式化和检查您的项目。

快速开始

  1. 安装
npm install - save-dev - save-exact @biomejs/biome
登录后复制

2.配置

npx @biomejs/biome init
登录后复制

当您运行上述命令时,它会自动创建 biome.json 文件。下面是运行

时默认生成的代码 上面的命令在biome.json中。

{
 "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
 "vcs": {
 "enabled": false,
 "clientKind": "git",
 "useIgnoreFile": false
 },
 "files": { "ignoreUnknown": false, "ignore": [] },
 "formatter": { "enabled": true, "indentStyle": "tab" },
 "organizeImports": { "enabled": true },
 "linter": {
 "enabled": true,
 "rules": { "recommended": true }
 },
 "javascript": { "formatter": { "quoteStyle": "double" } }
}
登录后复制

linter.enabled: true 启用linter 和rules.recommished: true 启用推荐规则。这对应于默认设置。

默认情况下启用格式化,但您可以通过显式使用 formatter.enabled: false 来禁用它。

3.生物群系命令

a.格式

您可以使用带有 — write 选项的 format 命令来格式化文件和目录:

npx @biomejs/biome format - write <files>
登录后复制

b.棉绒

您可以使用带有 — write 选项的 lint 命令对文件和目录进行 lint 和应用安全修复:

npx @biomejs/biome lint - write <files>
登录后复制

c.检查

您可以通过利用检查命令来运行格式和链接:

npx @biomejs/biome check - write <files>
登录后复制

Biome.js 在 t3-env 中的使用

  1. package.json 中的脚本
"lint": "biome check .",
"lint:fix": "biome check . - apply",
登录后复制

这被发现使用了应用格式和 linting 的 check CLI 命令。不过有一个变体,lint 只检查 linting 问题,但是当你执行 lint:fix 时,它是用 — apply 执行的。

— apply — Alias for — write,写入安全修复、格式化和导入排序(已弃用,使用 — write)

2.生物群落.json

{
 "$schema": "https://biomejs.dev/schemas/1.5.3/schema.json",
 "organizeImports": {
 "enabled": true
 },
 "formatter": {
 "enabled": true,
 "indentWidth": 2,
 "indentStyle": "space"
 },
 "linter": {
 "enabled": true,
 "rules": {
 "recommended": true,
 "a11y": {
 "noSvgWithoutTitle": "off",
 "useButtonType": "off",
 "useAltText": "off"
 },
 "complexity": {
 "noBannedTypes": "off"
 },
 "style": {
 "useImportType": "error",
 "useExportType": "error"
 }
 }
 },
 "overrides": [
 {
 "include": ["**/*.test.ts"],
 "linter": {
 "rules": {
 "suspicious": {
 "noExplicitAny": "off"
 }
 }
 }
 }
 ],
 "vcs": {
 "enabled": true,
 "clientKind": "git",
 "useIgnoreFile": true
 }
}
登录后复制

关于我们:

在 Thinkthroo,我们研究大型开源项目并提供架构指南。我们开发了使用 Tailwind 构建的可重用组件,您可以在项目中使用它们。我们提供 Next.js、React 和 Node 开发服务。

与我们预约会面讨论您的项目。

Biome.js, a toolchain to format and lint your web project

参考资料:

1. https://biomejs.dev/

2. https://github.com/t3-oss/t3-env/blob/main/biome.json

3. https://github.com/t3-oss/t3-env/blob/main/package.json#L10

以上是Biome.js,一个用于格式化和检查 Web 项目的工具链的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板