https://github.com/hjxenjoy/eslint-config-react-tsone

react app eslint config for typescript
https://github.com/hjxenjoy/eslint-config-react-tsone

Last synced: 10 days ago
JSON representation

react app eslint config for typescript

• Host: GitHub
• URL: https://github.com/hjxenjoy/eslint-config-react-tsone
• Owner: hjxenjoy
• License: mit
• Created: 2019-10-17T04:36:57.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2021-04-06T02:31:22.000Z (over 3 years ago)
• Last Synced: 2024-10-07T14:37:31.083Z (about 1 month ago)
• Language: JavaScript
• Size: 35.2 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# eslint-config-react-tsone

eslint config base on [eslint-config-react-app](https://www.npmjs.com/package/eslint-config-react-app) with typescript

## Installation

```sh

# use npm

npm install --save-dev eslint-config-react-tsone

# use yarn

yarn add -D eslint-config-react-tsone

```

## Configuration

### Add eslint config file

1. remove eslintConfig in `package.json`

2. create `.eslintrc` file in root directory

```json

{

  "extends": "react-tsone"

}

```

### Add prettier config file

create `.prettierrc` file into root directory

```json

{

  "parser": "typescript",

  "printWidth": 80,

  "tabWidth": 2,

  "useTabs": false,

  "singleQuote": true,

  "semi": false,

  "trailingComma": "es5",

  "bracketSpacing": true,

  "arrowParens": "avoid",

  "endOfLine": "auto",

  "overrides": [

    {

      "files": ["*.css", "*.less", "*.scss"],

      "options": {

        "singleQuote": false

      }

    }

  ]

}

```

### config eslint autoFixOnSave in vscode

Add code below into `.vscode/settings.json`

```json

{

  "editor.codeActionsOnSave": {

    "source.fixAll.eslint": true

  }

}

```

### config format on save in webstorm

**config eslint auto format**

Webstorm > Preferences > Languages & Frameworks > Javascript > Prettier

Run for files: `{**/*,*}.{js,ts,jsx,tsx}`

[x] On save

**config prettier auto format**

Webstorm > Preferences > Languages & Frameworks > Javascript > Code Quality Tools

Automatic Eslint configuration

[x] Run eslint --fix on save