首頁 >web前端 >js教程 >Biome.js,一個用於格式化和檢查 Web 專案的工具鏈

Biome.js,一個用於格式化和檢查 Web 專案的工具鏈

Patricia Arquette
Patricia Arquette原創
2024-12-03 00:43:10394瀏覽

我發現 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中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn