# eslint-config-harmony

> Strict, opinionated ESLint config for modern TypeScript apps.

Latest version **3.1.11** (published 2024-05-06) · ISC license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install eslint-config-harmony
pnpm add eslint-config-harmony
yarn add eslint-config-harmony
bun add eslint-config-harmony
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 3.1.11 |
| Published | 2024-05-06 |
| First published | 2023-10-09 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 22 |
| Unpacked size | 73.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3367 |
| Author | Hayden Bleasel |
| Maintainers | haydenbleasel |
| Keywords | harmony, eslint, prettier, stylelint, typescript |

## Links

- npm: https://www.npmjs.com/package/eslint-config-harmony
- Repository: https://github.com/haydenbleasel/eslint-config-harmony
- Homepage: https://github.com/haydenbleasel/eslint-config-harmony#readme
- Issues: https://github.com/haydenbleasel/eslint-config-harmony/issues
- npm.io page: https://npm.io/package/eslint-config-harmony

## Dependencies (22)

- [globals](https://npm.io/package/globals.md) ^13.24.0
- [eslint-plugin-n](https://npm.io/package/eslint-plugin-n.md) ^16.4.0
- [eslint-plugin-jest](https://npm.io/package/eslint-plugin-jest.md) ^27.6.0
- [stylelint-prettier](https://npm.io/package/stylelint-prettier.md) ^5.0.0
- [eslint-plugin-react](https://npm.io/package/eslint-plugin-react.md) ^7.33.2
- [eslint-plugin-import](https://npm.io/package/eslint-plugin-import.md) ^2.29.0
- [eslint-plugin-cypress](https://npm.io/package/eslint-plugin-cypress.md) ^2.15.1
- [eslint-plugin-promise](https://npm.io/package/eslint-plugin-promise.md) ^6.1.1
- [eslint-config-prettier](https://npm.io/package/eslint-config-prettier.md) ^9.1.0
- [eslint-plugin-jsx-a11y](https://npm.io/package/eslint-plugin-jsx-a11y.md) ^6.8.0
- [eslint-plugin-prettier](https://npm.io/package/eslint-plugin-prettier.md) ^5.0.1
- [eslint-plugin-storybook](https://npm.io/package/eslint-plugin-storybook.md) ^0.6.15
- [@next/eslint-plugin-next](https://npm.io/package/@next/eslint-plugin-next.md) ^14.0.4
- [@typescript-eslint/parser](https://npm.io/package/@typescript-eslint/parser.md) ^6.14.0
- [eslint-plugin-react-hooks](https://npm.io/package/eslint-plugin-react-hooks.md) ^4.6.0
- [eslint-plugin-tailwindcss](https://npm.io/package/eslint-plugin-tailwindcss.md) ^3.13.0
- [stylelint-config-standard](https://npm.io/package/stylelint-config-standard.md) ^35.0.0
- [prettier-plugin-tailwindcss](https://npm.io/package/prettier-plugin-tailwindcss.md) ^0.5.9
- [eslint-plugin-unused-imports](https://npm.io/package/eslint-plugin-unused-imports.md) ^3.0.0
- [@typescript-eslint/eslint-plugin](https://npm.io/package/@typescript-eslint/eslint-plugin.md) ^6.14.0
- [stylelint-config-idiomatic-order](https://npm.io/package/stylelint-config-idiomatic-order.md) ^10.0.0
- [eslint-import-resolver-typescript](https://npm.io/package/eslint-import-resolver-typescript.md) ^3.6.1

## Alternatives

- [eslint-plugin-sonarjs](https://npm.io/package/eslint-plugin-sonarjs.md) — 2.9M weekly downloads
- [eslint-config-expo](https://npm.io/package/eslint-config-expo.md) — 1.5M weekly downloads
- [@matter/protocol](https://npm.io/package/@matter/protocol.md) — 63.5K weekly downloads
- [@eventcatalog/linter](https://npm.io/package/@eventcatalog/linter.md) — 24.8K weekly downloads
- [@pandacss/eslint-plugin](https://npm.io/package/@pandacss/eslint-plugin.md) — 18.7K weekly downloads

## Recent versions

- 3.1.11 (latest) — 2024-05-06
- 3.1.10 — 2024-05-05
- 3.1.9 — 2024-03-01
- 3.1.8 — 2024-01-07
- 3.1.7 — 2023-12-26
- 3.1.6 — 2023-12-24
- 3.1.5 — 2023-12-14
- 3.1.4 — 2023-11-23
- 3.1.3 — 2023-11-23
- 3.1.2 — 2023-11-15
- 3.1.1 — 2023-11-14
- 3.1.0 — 2023-11-14
- 3.0.9 — 2023-11-13
- 3.0.8 — 2023-11-08
- 3.0.7 — 2023-11-06
- … 7 more at https://npm.io/package/eslint-config-harmony/versions

## README

<img src="./logo.svg" width="96" height="96" style="width: 96px; height: 96px;" alt="">

<br />

# Harmony

**Strict, opinionated ESLint config for modern TypeScript apps.**

<img src="https://img.shields.io/github/actions/workflow/status/haydenbleasel/eslint-config-harmony/push.yaml" alt="" />

<img src="https://img.shields.io/npm/dy/eslint-config-harmony" alt="" />

<img src="https://img.shields.io/npm/v/eslint-config-harmony" alt="" />

<img src="https://img.shields.io/github/license/haydenbleasel/eslint-config-harmony" alt="" />

<hr />

## Overview

Harmony is an ESLint config for modern TypeScript apps. It's designed to be used with [Prettier](https://prettier.io/) and [Stylelint](https://stylelint.io/). It is incredibly opinionated and strict, enforcing the maximum amount of type safety and code quality through ESLint rules and TypeScript compiler options. It is designed for [Next.js](https://nextjs.org/) apps, but can be used with any TypeScript project, such as [React Native](https://reactnative.dev/) or [Node.js](https://nodejs.org/).

Harmony is designed to be used with [VS Code](https://code.visualstudio.com/), and includes a `.vscode/settings.json` file that enables full formatting on save.

## Features

By default, Harmony combines with pre-defined rulesets for [ESLint](https://eslint.org/), as well as:

- [Import](https://www.npmjs.com/package/eslint-plugin-import)
- [jsx-a11y](https://www.npmjs.com/package/eslint-plugin-jsx-a11y)
- [React](https://www.npmjs.com/package/eslint-plugin-react)
- [React Hooks](https://www.npmjs.com/package/eslint-plugin-react-hooks)
- [jest](https://www.npmjs.com/package/eslint-plugin-jest)
- [promise](https://www.npmjs.com/package/eslint-plugin-promise)
- [n](https://www.npmjs.com/package/eslint-plugin-n)
- [Typescript](https://www.npmjs.com/package/@typescript-eslint/eslint-plugin)
- [Prettier](https://www.npmjs.com/package/eslint-plugin-prettier)
- [Tailwind](https://github.com/tailwindlabs/prettier-plugin-tailwindcss)
- [Stylelint](https://stylelint.io/)
- [Stylelint-Prettier](https://www.npmjs.com/package/stylelint-prettier)
- [Next.js](https://nextjs.org/docs/basic-features/eslint#eslint-plugin)
- [Cypress](https://www.npmjs.com/package/eslint-plugin-cypress)

## Installation

Run the command below to install Harmony with peer dependencies:

```sh
pnpm add -D eslint-config-harmony eslint@8 prettier stylelint typescript jest
```

If you're running [VS Code](https://code.visualstudio.com/), ensure you have the following extensions installed:

```sh
code --install-extension dbaeumer.vscode-eslint
code --install-extension esbenp.prettier-vscode
code --install-extension bradlc.vscode-tailwindcss
code --install-extension stylelint.vscode-stylelint
```

## Setup

Create an `eslint.config.mjs` with the following contents:

```js
import harmony from 'eslint-config-harmony';

export default harmony;
```

Add the following to your `package.json`:

```json
{
  "prettier": "eslint-config-harmony/prettier",
  "stylelint": {
    "extends": "eslint-config-harmony/stylelint"
  }
}
```

Create a `.vscode/settings.json` file with the following contents:

```json
{
  "typescript.tsdk": "node_modules/typescript/lib",
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.formatOnSave": true,
  "editor.formatOnPaste": true,
  "emmet.showExpandedAbbreviation": "never",
  "editor.codeActionsOnSave": {
    "source.fixAll.esbenp.prettier-vscode": "explicit",
    "source.fixAll.eslint": "explicit",
    "source.fixAll.stylelint": "explicit"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "eslint.useFlatConfig": true,
  "eslint.options": {
    "overrideConfigFile": "eslint.config.mjs"
  }
}
```

Lastly, ensure your `tsconfig.json` (if it exists) includes your new ESLint config and that `strictNullChecks` is enabled.

```json
{
  "compilerOptions": {
    "strictNullChecks": true
  },
  "include": ["eslint.config.mjs"]
}
```

## Usage

Once Harmony is set up, it will automatically format your code on save.

## Configuration

You can opt-out of certain rules by modifying your `eslint.config.mjs` file. For example, here's a common exception I use to avoid linting [shadcn/ui](https://ui.shadcn.com/) components:

```js
import harmony from 'eslint-config-harmony';

harmony.forEach((config) => {
  if (config.ignores) {
    config.ignores.push('./components/ui/**/*');
  } else {
    config.ignores = ['./components/ui/**/*'];
  }
});

export default harmony;
```

## Debugging

If you're having issues with Harmony, you can open the ESLint Output panel in VS Code to see what's going on. Optimally, it should look something like this:

```
[Info  - 10:42:49 PM] ESLint server is starting.
[Info  - 10:42:49 PM] ESLint server running in node v18.15.0
[Info  - 10:42:49 PM] ESLint server is running.
[Info  - 10:42:50 PM] ESLint library loaded from: /Users/haydenbleasel/GitHub/harmony/node_modules/.pnpm/eslint@8.51.0/node_modules/eslint/lib/unsupported-api.js
```

If you see any errors, it could be related to peer dependencies or changes in dependency versions. Feel free to report these as issues.

## Roadmap

- https://github.com/SonarSource/eslint-plugin-sonarjs
- https://github.com/BenoitZugmeyer/eslint-plugin-html
- https://github.com/ota-meshi/eslint-plugin-yml
- https://github.com/mdx-js/eslint-mdx/tree/master/packages/eslint-plugin-mdx
- https://github.com/eslint/eslint-plugin-markdown
- https://github.com/amilajack/eslint-plugin-compat
- https://github.com/sindresorhus/eslint-plugin-unicorn

---
_Source: https://npm.io/package/eslint-config-harmony · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._