SWR Audio Lab Style Guide

Introduction

This repository is the home of an based on Vercel's style guide, which includes configs for popular linting and styling tools.

The following configs are available, and are designed to be used together.

• Prettier
• ESLint
• Biome

Installation

All of our configs are contained in one package, @swrlab/style-guide. To install:

bun add --dev @swrlab/style-guide

# or with other package manager:
npm install --save-dev @swrlab/style-guide
yarn add --dev @swrlab/style-guide
pnpm i -D @swrlab/style-guide

Some of our ESLint configs require peer dependencies. We'll note those alongside the available configs in the ESLint section.

Prettier

Note: Prettier is a peer-dependency of this package, and should be installed at the root of your project.

See: https://prettier.io/docs/en/install.html

To use the shared Prettier config, create a prettier.config.js or prettier.config.mjs if in a non-ESM project with following contents:

import audiolabPrettierConfig from '@swrlab/style-guide/prettier.js'

/**
 * @see https://prettier.io/docs/configuration
 * @type {import('prettier').Config}
 */
const config = {
  ...audiolabPrettierConfig,
}

export default config

Another way is to set the following in package.json.

{
  "prettier": "@swrlab/style-guide/prettier.js"
}

ESLint

Note: ESLint is a peer-dependency of this package, and should be installed at the root of your project.

See: https://eslint.org/docs/user-guide/getting-started#installation-and-usage

Usage:

// eslint.config.mjs
import { audiolab } from '@swrlab/style-guide/eslint.js'

export default audiolab(
  {
    prettier: true,
    vue: true,
  },
  [
    /* your custom ESLint config */
  ]
)

Development

For development and testing of the rules you can use:

bun run dev

# or with node:
npm run dev

Biome

To use the shared Biome config, set the following in biome.json:

{
  "extends": ["@swrlab/style-guide/biome.json"]
}

Credits

This config used to be inspired by the work of The Vercel Style Guide and is further based on a mix of:

• https://github.com/antfu/eslint-config
• https://github.com/sxzz/eslint-config

Contributing

After cloning, you can run bun install (or npm install) to install the npm dependencies.

Development

Start a local eslint-config-inspector:

$ bun run dev

Build types and the config into dist/:

$ bun run build

License

ISC