For several years I use Eslint in my side projects, for Vue, JS, TS, Astro etc.
I created npm packages with my favorite rules for TS, Vue, astro, etc like :
- space after function
public test () { }
- space before / after equal
const test = trueor{ test : true }
- 4 spaces indent
- indent in Vue
script tag
- backtick for string
- etc
I also added husky and lint-staged to lint code before commit.
But... ^^
Each time to install, configure or update Eslint packages, it was annoying for me.
It was a challenge on each Github DepsBot PT for it ^^.
So last week I started to switch to Biome. I started with one project, today I switched almost all my side projects.
Reading Biome doc I also switched from husky to lefthook.
Pro
First thing I like, switching to Biome, I removed almost 10 npm packages :
eslint@vue/eslint-config-typescript@typescript-eslint/eslint-plugin@vue/eslint-config-typescript- my own eslint rules packages
- etc
lint-staged was removed, lefthook doesn't need it to lint staged files.
My lefthhok config :
pre-commit:
commands:
check:
glob: "*.{js,vue,ts,cjs,mjs,d.cts,d.mts,jsx,tsx,json,jsonc}"
run: npx biome check --no-errors-on-unmatched --files-ignore-unknown=true {staged_files}
commit-msg:
commands:
lint-commit-msg:
run: npx commitlint --edit
pre-push:
commands:
test:
run: npm run test:cov
Biome is really easy to install and fast : Checked 442 files in 94ms..
Biome config file looks like this :
{
"$schema": "https://biomejs.dev/schemas/1.7.0/schema.json",
"organizeImports": {
"enabled": true
},
"files": {
"ignore": ["package.json", "package-lock.json"]
},
"linter": {
"enabled": true,
"rules": {
"recommended": true,
"style": {
"noUnusedTemplateLiteral": "off"
}
}
},
"formatter": {
"indentStyle": "space",
"indentWidth": 4,
"lineWidth": 320
},
"javascript": {
"formatter": {
"semicolons": "asNeeded"
}
}
}
With Biome we can format, lint and check (format + lint) code. And a migrate command allows to generate Biome config from our Eslint config.
This is why I like Biome <3.
Cons
For me, the only con is ... I lost some of my favorite rules, like space after function name.
But I stay on Biome <3.
Note
Just, If you use NestJs take care about lint/style/useImportType rule ;).
First time I ran Biome on my Nest project, it formatted some code with import type :
Format import { TagService } from "./tag.service" to import type { TagService } from "./tag.service"
And I had an error : Nest can't resolve dependencies of the TagController.
I added some comment to ignore this rule for some imports : // biome-ignore lint/style/useImportType: <explanation>.
And now ?
My side projects arn't big projects. Biome offers a way to migrate big project.
We're speaking of that in my company but for now we keep Eslint.
I'm following Biome project, I hope my favorite rules comming ;).
And I can update my zx script to install eslint to install Biome and Lefthook.