Skip to main content Accessibility Feedback

A better linter

For years, JSHint has been my linter of choice. I like the defaults, and it basically works well out-of-the-box without any configuration.

But I’ve had to use Typescript a lot more lately, and JSHint doesn’t work with it.

In year’s past, I’ve used ESLint, but I kind of hate it. It just requires far too much configuring and fiddling for my liking.

I recently learned about Biome, and I’ve been absolutely delighted with it.

Biome combines the functionality of ESLint and Prettier. It runs absurdly fast. It requires basically no configuration. The out-of-the-box defaults are that good.

And if you still use Sublime like I do, the LSP integration for Biome can show linting errors in real time, suggest fixes, and automatically insert comments instruction Biome to ignore certain lines.

I do include a tiny biome.json config file in my projects. Here’s what it looks like…

{
	"$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
	"javascript": {
		"formatter": {
			"quoteStyle": "single",
			"lineWidth": 120,
			"indentWidth": 4,
			"trailingCommas": "es5"
		}
	},
	"files": {
		"include": ["./path-to-source-directory"]
	}
}

This tells Biome to…

  • Use the default config settings included with the install.
  • Use single quotes for JavaSCript.
  • Allow a max line width of 120 (an increase from the default).
  • Indent with 4 spaces (in my case, as a tab).
  • And always use trailing commas when possible.

It also lints only files from the source directory (skipping build directories, Node Modules, and so on).

I create an NPM script to run my linter, but you can manually run it in the command line like this…

npx @biomejs/biome lint

You can also have it automatically transform and prettify you code with this command…

npx @biomejs/biome lint --write

This will automatically fix easily fixable errors, reorder ESM imports, and more.