@mkappelhof/biome-config 1.0.0 → 1.1.1

package/AGENTS.md

@@ -6,9 +6,12 @@ This project's `biome.json` extends `@mkappelhof/biome-config`. Biome handles li
 
 - `pnpm biome check .` lints, checks formatting and checks import order.
 - `pnpm biome check --write .` applies safe fixes, formats and sorts imports.
-- `pnpm biome check --write <files>` does the same for specific files.
+- `pnpm biome check --write --unsafe .` also applies unsafe fixes (e.g. `useBlockStatements`
+  wrapping a bare `if (x) return;` in braces). Review the diff — unsafe fixes are low-risk here,
+  not unreviewed.
+- `pnpm biome check --write <files>` (optionally with `--unsafe`) does the same for specific files.
 
-Run `pnpm biome check --write` on the files you changed before you finish a task. The task is not done while `pnpm biome check .` reports errors. Files listed in `.gitignore` are skipped.
+Run `pnpm biome check --write --unsafe` on the files you changed before you finish a task. The task is not done while `pnpm biome check .` reports errors. Files listed in `.gitignore` are skipped.
 
 ## Formatting (applied automatically, do not fight it)
 
@@ -19,37 +22,46 @@ Run `pnpm biome check --write` on the files you changed before you finish a task
 ## Import order
 
 Imports are sorted into these groups, in this order:
-
 1. Node/Bun built-ins (`node:fs`, `bun:test`)
 2. `react`
 3. URLs, packages and aliases
-4. *(blank line)* CSS / SCSS imports
-5. *(blank line)* SVG imports
+4. _(blank line)_ CSS / SCSS imports
+5. _(blank line)_ SVG imports
 
 Let `biome check --write` order imports for you. Do not order them by hand.
 
 ## Lint rules
 
 The `recommended` preset is enabled, plus these rules as errors:
-
 - **No `any`** (`noExplicitAny`). Use `unknown` and narrow it, or write a proper type.
 - **No `console`** (`noConsole`). Use the project's logger, or remove debug output before you finish. Allowed in `*.config.*`, `scripts/**` and `bin/**` files, where logging is normal.
 - **No unused imports or variables** (`noUnusedImports`, `noUnusedVariables`). Prefix intentionally unused variables or parameters with `_`.
 - **Type-only imports and exports use `type`** (`useImportType`, `useExportType`): `import type { Foo } from './foo'` or `import { type Foo, bar } from './foo'`.
 - **Node built-ins use the `node:` prefix** (`useNodejsImportProtocol`): `import { readFile } from 'node:fs/promises'`.
 - **Arrow functions that only return a value use a concise body** (`useConsistentArrowReturn`): `(x) => x * 2`, not `(x) => { return x * 2; }`.
+- **Braceless single-statement bodies are not allowed** (`useBlockStatements`): write `if (!x) { throw new Error(); }`, not `if (!x) throw new Error();` or `if (x) return;`. Applies to `if`/`else`, loops and similar. The auto-fix for this one is unsafe (see Commands above), not unavailable.
 
 Framework-specific rules (React, Next.js, test runners) are turned on automatically based on the dependencies in `package.json`. If the project's `biome.json` sets `linter.domains` explicitly (see its README), treat that as the source of truth instead.
 
 Fix the cause of a diagnostic. Do not add `// biome-ignore` unless there is no reasonable alternative, and always give a reason: `// biome-ignore lint/<group>/<rule>: <reason>`. Do not disable rules or change formatter settings in the project's `biome.json` to get a check to pass.
 
-## Tool boundaries
+## CSS/SCSS
 
-Biome covers JS/TS/JSON (and HTML, via `experimentalFullSupportEnabled`). If the project also
-lints CSS/SCSS with Stylelint (see `@mkappelhof/stylelint-config`), leave that to Stylelint —
-don't add `**/*.css`/`**/*.scss` to this config's `files.includes` and don't add a Biome CSS
-override to replace it.
+Biome 2.6+ fully parses, formats and lints `.scss` files (not just CSS Modules), and
+`files.includes` matches them by default. On top of `recommended`, these are pinned as errors:
+`useGenericFontNames`, `noInvalidDirectionInLinearGradient`, `noInvalidGridAreas`,
+`noInvalidPositionAtImportRule`, `noMissingVarFunction`, `noUnknownMediaFeatureName`,
+`noUnknownProperty`, `noUnknownPseudoClass`, `noUnknownPseudoElement`, `noUnknownTypeSelector`,
+`noUnknownUnit`, `noUnmatchableAnbSelector`, `noDeprecatedMediaType`, `noDuplicateAtImportRules`,
+`noDuplicateCustomProperties`, `noDuplicateFontNames`, `noDuplicateProperties`,
+`noDuplicateSelectorsKeyframeBlock`, `noEmptyBlock`, `noEmptySource`, `noImportantInKeyframe` and
+`noIrregularWhitespace`. Use `// biome-ignore lint/<group>/<rule>: <reason>` the same as for JS/TS,
+not a `/* stylelint-disable */` comment.
+
+## Tool boundaries
 
-Never run `git commit`, create a branch, or push, unless you are explicitly asked to. Leave
-changes as uncommitted/staged working-tree edits and let the user commit, branch and push
-themselves.
+Biome covers JS/TS/JSON/CSS/SCSS (and HTML, via `experimentalFullSupportEnabled`). If the project
+also lints CSS/SCSS with Stylelint (see `@mkappelhof/stylelint-config`) rather than relying on
+Biome's CSS rules, the project's own `biome.json` must exclude style files from this config's
+`files.includes` (`"!**/*.css"`, `"!**/*.scss"`) so the two tools don't both process them — check
+there before assuming Biome owns `.scss` files in a given project.

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @mkappelhof/biome-config
 
+## 1.1.1
+
+### Patch Changes
+
+- bb566eb: Update settings
+
+## 1.1.0
+
+### Minor Changes
+
+- 3c4c6b4: Enable `useBlockStatements` so braceless single-statement bodies (`if (!x) throw ...;`, `if (x) return;`) are flagged. Its fix is unsafe, so apply it with `biome check --write --unsafe` rather than plain `--write`.
+- 3c4c6b4: Bump Biome to 2.6.2, which adds full SCSS support (not just CSS Modules) to Biome's own parser, formatter and linter. Pin the CSS/SCSS lint rules that mirror `@mkappelhof/stylelint-config`'s rule set (`noUnknownProperty`, `noDuplicateProperties`, `noEmptyBlock`, etc.) as explicit errors, on top of the `recommended` preset that already covers most of them. `@mkappelhof/stylelint-config` is unchanged and still recommended for SCSS-heavy projects, since Biome's CSS linter doesn't yet cover SCSS-specific or stylistic rules.
+
+## 1.0.1
+
+### Patch Changes
+
+- eb2577f: Add new configs
+
 ## 2.0.0
 
 ### Major Changes

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Maurice
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -92,18 +92,29 @@ Install the Biome extension for your editor and make it the default formatter. F
 
 ## What's included
 
-- **Files:** everything Biome supports (JS/TS/JSX, JSON, CSS, HTML, GraphQL), except files in `.gitignore` and `dist`, `build`, `out`, `coverage`, `.next`, `.astro`, `.vercel` and `.turbo`.
+- **Files:** everything Biome supports (JS/TS/JSX, JSON, CSS, SCSS, Markdown, YAML, HTML, GraphQL), except files in `.gitignore` and `dist`, `build`, `out`, `coverage`, `.next`, `.astro`, `.vercel` and `.turbo`.
 - **Formatter:** 2 spaces, 100-character lines, single quotes, semicolons, ES5 trailing commas. An `.editorconfig` takes precedence.
-- **Linter:** the `recommended` preset, plus these rules as errors: `noExplicitAny`, `noConsole`, `noUnusedImports`, `noUnusedVariables`, `useImportType`, `useExportType`, `useNodejsImportProtocol` and `useConsistentArrowReturn`. `noConsole` is off again in `*.config.*`, `scripts/**` and `bin/**` files. Framework rules (React, Next.js, tests) are turned on automatically based on your dependencies — see [below](#deterministic-framework-rules) to pin them explicitly instead.
+- **Linter:** the `recommended` preset, plus these rules as errors:
+  - JS/TS: `noExplicitAny`, `noConsole`, `noUnusedImports`, `noUnusedVariables`, `useImportType`, `useExportType`, `useNodejsImportProtocol`, `useConsistentArrowReturn` and `useBlockStatements` (no braceless `if (x) return;`/`if (!x) throw ...;` — its fix is unsafe, so run `biome check --write --unsafe` to apply it). `noConsole` is off again in `*.config.*`, `scripts/**` and `bin/**` files.
+  - CSS/SCSS: `useGenericFontNames`, `noInvalidDirectionInLinearGradient`, `noInvalidGridAreas`, `noInvalidPositionAtImportRule`, `noMissingVarFunction`, `noUnknownMediaFeatureName`, `noUnknownProperty`, `noUnknownPseudoClass`, `noUnknownPseudoElement`, `noUnknownTypeSelector`, `noUnknownUnit`, `noUnmatchableAnbSelector`, `noDeprecatedMediaType`, `noDuplicateAtImportRules`, `noDuplicateCustomProperties`, `noDuplicateFontNames`, `noDuplicateProperties`, `noDuplicateSelectorsKeyframeBlock`, `noEmptyBlock`, `noEmptySource`, `noImportantInKeyframe` and `noIrregularWhitespace` — these are every rule Biome 2.6+ ships with a direct equivalent to `@mkappelhof/stylelint-config`'s rule set (`stylelint-config-standard` + `stylelint-config-recommended-scss`), most already in the `recommended` preset but pinned explicitly here.
+  - Framework rules (React, Next.js, tests) are turned on automatically based on your dependencies — see [below](#deterministic-framework-rules) to pin them explicitly instead.
 - **HTML:** `experimentalFullSupportEnabled` is on, so Biome formats full HTML/Astro templates rather than only the parts it previously supported.
 - **Imports:** sorted into groups: Node/Bun built-ins, React, packages/aliases, then stylesheets and SVGs, each after a blank line.
 
 ## Pairing with Stylelint
 
-Biome can format/lint CSS and SCSS, but if the project uses `@mkappelhof/stylelint-config` for
-style files (recommended for SCSS-heavy projects — `@use`, nesting, etc.), don't let both tools
-touch the same files. Either exclude style files from this config's `files.includes` in the
-project's `biome.json`, or just don't point Stylelint and Biome at overlapping globs.
+As of Biome 2.6, SCSS support is no longer limited to CSS Modules — Biome fully parses, formats
+and lints `.scss` files, and `files.includes` matches them by default (no opt-in needed). If the
+project also uses `@mkappelhof/stylelint-config`, the two tools will now process the same files
+unless you stop one of them: exclude style files from this config's `files.includes` in the
+project's `biome.json` (`"!**/*.css"`, `"!**/*.scss"`), or don't point Stylelint at files Biome
+already covers.
+
+`@mkappelhof/stylelint-config` still covers more ground — SCSS-specific checks (`scss/*` rules,
+`@use`/`@mixin`/`@include` correctness) and most stylistic rules (empty-line conventions, color
+notation, quoting, etc.) that Biome's CSS linter doesn't have an equivalent for yet — so for new
+SCSS-heavy projects, or any project not yet on Biome 2.6+, keep using it instead of relying on
+Biome alone.
 
 ## AI agents
 

package/biome.json

@@ -1,5 +1,5 @@
 {
-  "$schema": "https://biomejs.dev/schemas/2.5.15/schema.json",
+  "$schema": "https://biomejs.dev/schemas/2.6.4/schema.json",
   "vcs": {
     "enabled": true,
     "clientKind": "git",
@@ -38,19 +38,45 @@
     "enabled": true,
     "rules": {
       "preset": "recommended",
+      "a11y": {
+        "useGenericFontNames": "error"
+      },
       "correctness": {
         "noUnusedImports": "error",
-        "noUnusedVariables": "error"
+        "noUnusedVariables": "error",
+        "noInvalidDirectionInLinearGradient": "error",
+        "noInvalidGridAreas": "error",
+        "noInvalidPositionAtImportRule": "error",
+        "noMissingVarFunction": "error",
+        "noUnknownMediaFeatureName": "error",
+        "noUnknownProperty": "error",
+        "noUnknownPseudoClass": "error",
+        "noUnknownPseudoElement": "error",
+        "noUnknownTypeSelector": "error",
+        "noUnknownUnit": "error",
+        "noUnmatchableAnbSelector": "error"
       },
       "suspicious": {
         "noConsole": "error",
-        "noExplicitAny": "error"
+        "noExplicitAny": "error",
+        "noDeprecatedMediaType": "error",
+        "noDuplicateAtImportRules": "error",
+        "noDuplicateCustomProperties": "error",
+        "noDuplicateFontNames": "error",
+        "noDuplicateProperties": "error",
+        "noDuplicateSelectorsKeyframeBlock": "error",
+        "noEmptyBlock": "error",
+        "noEmptySource": "error",
+        "noImportantInKeyframe": "error",
+        "noIrregularWhitespace": "error",
+        "noShorthandPropertyOverrides": "error"
       },
       "style": {
         "useImportType": "error",
         "useExportType": "error",
         "useNodejsImportProtocol": "error",
-        "useConsistentArrowReturn": "error"
+        "useConsistentArrowReturn": "error",
+        "useBlockStatements": "error"
       }
     }
   },
@@ -75,11 +101,7 @@
   },
   "overrides": [
     {
-      "includes": [
-        "**/*.config.*",
-        "**/scripts/**",
-        "**/bin/**"
-      ],
+      "includes": ["**/*.config.*", "**/scripts/**", "**/bin/**"],
       "linter": {
         "rules": {
           "suspicious": {
@@ -97,10 +119,7 @@
           "level": "on",
           "options": {
             "groups": [
-              [
-                ":NODE:",
-                ":BUN:"
-              ],
+              [":NODE:", ":BUN:"],
               "react",
               [
                 ":URL:",
@@ -113,10 +132,7 @@
                 "!**/*.svg"
               ],
               ":BLANK_LINE:",
-              [
-                "**/*.css",
-                "**/*.scss"
-              ],
+              ["**/*.css", "**/*.scss"],
               ":BLANK_LINE:",
               "**/*.svg"
             ]
@@ -125,4 +141,4 @@
       }
     }
   }
-}
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mkappelhof/biome-config",
-  "version": "1.0.0",
+  "version": "1.1.1",
   "description": "Shared Biome configuration (linting + formatting)",
   "main": "biome.json",
   "exports": {
@@ -17,20 +17,21 @@
   "license": "MIT",
   "repository": "git@github.com:mkappelhof/frontend-tools.git",
   "author": "Maurice Kappelhof <maurice@mauricekappelhof.nl>",
-  "scripts": {
-    "lint": "biome check --vcs-enabled=false biome.json package.json README.md AGENTS.md",
-    "test": "node test/run.mjs"
-  },
   "peerDependencies": {
-    "@biomejs/biome": "^2.5.0"
+    "@biomejs/biome": "2.6.4"
   },
   "devDependencies": {
-    "@biomejs/biome": "2.5.15"
+    "@biomejs/biome": "2.6.4"
   },
   "keywords": [
     "biome",
     "lint",
     "format",
     "config"
-  ]
+  ],
+  "scripts": {
+    "lint": "biome check --vcs-enabled=false biome.json package.json README.md AGENTS.md",
+    "test": "node test/run.mjs",
+    "clean": "rimraf node_modules"
+  }
 }