Related —
	🗜️ Compress —		🦔 Inline —

🗻 [Format] —

This [Astro integration][astro-integration] brings Biome tools to your Astro
project.

[Biome][Biome]

> Note
>
> Format will not lint / format your requests, only your statically generated
> build and pre-rendered routes.

🚀 Installation

There are two ways to add integrations to your project. Let's try the most
convenient option first!

$3

Astro includes a CLI tool for adding first party integrations: astro add. This
command will:

1. (Optionally) Install all necessary dependencies and peer dependencies
2. (Also optionally) Update your astro.config.* file to apply this integration

To install Format, run the following from your project directory and follow
the prompts:

Using NPM:

``sh
npx astro add @playform/format
`

Using Yarn:

`sh
yarn astro add @playform/format
`

Using PNPM:

`sh
pnpx astro add @playform/format
`

$3

First, install the Format integration like so:

`sh
npm install -D -E @playform/format
`

Then, apply this integration to your astro.config.* file using the
integrations property:

astro.config.ts

`ts
import Biome from "@playform/format";

export default { integrations: [Biome()] };
`

Getting started

The utility will now lint and format with [Biome][Biome] all of your JavaScript
and TypeScript files, including CommonJS modules in the Astro outDir folder.

You can override any of the default options from the configurations of:

- biome

or disable them entirely:

astro.config.ts

`ts
import Biome from "@playform/format";

export default {
integrations: [
Biome({
Biome: false,
}),
],
};
`

> Note
>
> If you provide a biome.json config file the utility will pick it up
> automatically.

> [!WARNING]
>
> The configuration options from the astro.config.ts file will override the
> biome.json config.

$3

You can add multiple paths to validate / format by specifying an array as the
Path variable.

astro.config.ts

`ts
import Biome from "@playform/format";

export default {
integrations: [
Biome({
Path: ["./Target", "./Build"],
}),
],
};
`

$3

You can also provide a map of paths for different input output directories:

astro.config.ts

`ts
import Biome from "@playform/format";

export default {
integrations: [
Biome({
Path: new Map([["./Source", "./Target"]]),
}),
],
};
`

Or an array of the two:

astro.config.ts

`ts
import Biome from "@playform/format";

export default {
integrations: [
Biome({
Path: [
// Format Target
"./Target",
// Format Target one more time into a different directory
new Map([["./Target", "./TargetInline"]]),
],
}),
],
};
`

$3

You can provide a filter to exclude files from formatting. A filter can be an
array of regexes or a single match. You can use functions, as well to match on
file names:

astro.config.ts

`ts
import Biome from "@playform/format";

export default {
integrations: [
Biome({
Exclude: [
"Firebase.ts",
(File: string) => File === "./Source/Library/File.ts",
],
}),
],
};
`

$3

Set Logger to 0 if you do not want to see debug messages. Default is 2:

astro.config.ts

`ts
import Biome from "@playform/format";

export default {
integrations: [
Biome({
Logger: 0,
}),
],
};
`

[Format]: HTTPS://NPMJS.Org/@playform/format
[Biome]: HTTPS://NPMJS.Org/@biomejs/biome
[astro-integration]: HTTPS://docs.astro.build/en/guides/integrations-guide/

Changelog

See CHANGELOG.md` for a history of changes to this integration.