# eslint-config-lofty87

> custom eslint config on typescript, eslint, prettier

Latest version **1.1.15** (published 2020-07-31) · MIT license · 0 weekly downloads

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

## Install

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

## Health

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

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 1.1.15 |
| Published | 2020-07-31 |
| First published | 2020-06-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 5 |
| Unpacked size | 17.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | lofty87 |
| Maintainers | lofty87 |
| Keywords | typescript, eslint, eslint-config, prettier |

## Links

- npm: https://www.npmjs.com/package/eslint-config-lofty87
- Repository: https://github.com/lofty87/eslint-config
- Issues: https://github.com/lofty87/eslint-config/issues
- npm.io page: https://npm.io/package/eslint-config-lofty87

## Dependencies (5)

- [eslint-plugin-import](https://npm.io/package/eslint-plugin-import.md) ^2.21.2
- [eslint-config-prettier](https://npm.io/package/eslint-config-prettier.md) ^6.11.0
- [@typescript-eslint/parser](https://npm.io/package/@typescript-eslint/parser.md) ^3.4.0
- [eslint-config-airbnb-typescript](https://npm.io/package/eslint-config-airbnb-typescript.md) ^8.0.2
- [@typescript-eslint/eslint-plugin](https://npm.io/package/@typescript-eslint/eslint-plugin.md) ^3.4.0

## 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

- 1.1.15 (latest) — 2020-07-31
- 1.1.14 — 2020-07-30
- 1.1.13 — 2020-07-30
- 1.1.12 — 2020-07-30
- 1.1.11 — 2020-07-29
- 1.1.10 — 2020-07-29
- 1.1.9 — 2020-07-25
- 1.1.8 — 2020-07-23
- 1.1.7 — 2020-07-15
- 1.1.6 — 2020-07-14
- 1.1.5 — 2020-07-14
- 1.1.4 — 2020-07-14
- 1.1.3 — 2020-07-14
- 1.1.2 — 2020-07-14
- 1.1.1 — 2020-07-14
- … 19 more at https://npm.io/package/eslint-config-lofty87/versions

## README

# eslint-config-lofty87

It can be applied to projects using typescript, eslint and prettier in vscode. (also, react projects)

This eslint config is based on [eslint-config-airbnb-typescript](https://github.com/iamturns/eslint-config-airbnb-typescript).

After pressing `F11`, you can be formatting it through save.

## 1. Prerequisite

- typescript(>=3.6, tsconfig.json)
- eslint(>=7.3)
- vscode plugin(ESLint, Prettier - Code formatter)

## 2. Dependencies

**1. base**

- @typescript-eslint/eslint-plugin
- @typescript-eslint/parser
- eslint-config-airbnb-typescript
- eslint-config-prettier
- eslint-plugin-import

**2. react (include base)**

- eslint-plugin-jsx-a11y
- eslint-plugin-react
- eslint-plugin-react-hooks

## 3. Installation

**Using npm :**

#### 1. base

```bash
npm install --save eslint-config-lofty87
```

#### 2. react

```bash
npm install --save eslint-config-lofty87 eslint-plugin-jsx-a11y@^6.2.3 eslint-plugin-react@^7.19.0 eslint-plugin-react-hooks@^2.5.0
```

## 4. Configuration

#### 1. prettier

create `.prettierrc` in project root and copy json below

```json
{
  "singleQuote": true,
  "printWidth": 160,
  "tabWidth": 2,
  "useTabs": false,
  "semi": true,
  "quoteProps": "as-needed",
  "jsxSingleQuote": false,
  "trailingComma": "es5",
  "arrowParens": "always",
  "endOfLine": "lf",
  "bracketSpacing": true,
  "jsxBracketSameLine": false,
  "requirePragma": false,
  "insertPragma": false,
  "proseWrap": "preserve",
  "vueIndentScriptAndStyle": false
}
```

go to vscode user `settings.json` and include json below

```json
{
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[graphql]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  }
}
```

go to vscode *File-Preferences-Keyboard Shortcuts*,

change the **Format Document** value to `F11`.

now, you can be prettier formatting it through `F11`

#### 2. eslint

create `.eslintrc.json` in project root and copy json below

```json
{
  "extends": [
    "eslint-config-lofty87"
  ]
}
```

or

```json
{
  "extends": [
    "eslint-config-lofty87/react"
  ]
}
```

or you can omit the **eslint-config-** in front.

```json
{
  "extends": [
    "lofty87"
  ]
}
```

go to vscode user `settings.json` and include json below

```json
{
  "eslint.alwaysShowStatus": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }
}
```

now, you can be eslint linting and can be formatting it by saving

## 5. Namespaces

- eslint-config-lofty87(=base)
- eslint-config-lofty87/base
- eslint-config-lofty87/react

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