@knotel/eslint-config-react

Knotel shared eslint configuration for React-based applications and components

[![NPM Version][npm-image]][npm-url] [![Build Status][travis-image]][travis-url] [![Downloads Stats][npm-downloads]][npm-url]

Installation

yarn add --dev @knotel/eslint-config-react

Also make sure to add the peerDependencies:

yarn add --dev eslint eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks

Usage

In order to use the shared config simply add the following to your package.json:

{
  "name": "@knotel/my-package",
  "version": "1.0.0",
  ...
  "eslintConfig": {
    "extends": [
      "@knotel/eslint-config-react"
    ]
  },
  "eslintIgnore": [
    "node_modules",
    "dist",
    ".cache"
  ],
  ...
}

You can also add it in an .eslintrc or eslintrc.json file but adding the config in your package.json will reduce unnecessary clutter.

Configuring your VSCode workspace

For the best developer experience, follow these steps to configure VSCode:

1. Make sure you have ESlint configured in VSCode (Extensions > Search for "Eslint" > Install)
2. Install the StandardJS extensions for VSCode
3. Add these keys to your VScode settings JSON:

  "standard.autoFixOnSave": true,
  "eslint.autoFixOnSave": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "typescript",
      "autoFix": true
    },
    {
      "language": "typescriptreact",
      "autoFix": true
    }
  ],

4. Add some scripts to your package.json:

  "scripts": {
    ...
    "test:lint": "eslint --ext .js --ext .jsx src",
    "test:lint:fix": "eslint --ext .js --ext .jsx src --fix",
    ...
  },

Contributing

Submit a pull request against the mono repo