Decouple eslint config from React

[jonoliver]

Creating this issue as a discussion space on how we might decouple our Eslint config from library-specific dependencies.

The Problem

Currently, our eslint config is based on the airbnb config, which provides lots of useful things for React projects, but adds complications if you want to use the Sparkbox configuration on non-React projects. Without installing the React specific peer dependencies, you'll see warnings like:

Warning: React version was set to "detect" in eslint-plugin-react settings, but the "react" package is not installed. Assuming latest React version for linting.

There is a very hacky fix for this, by adding the following to .eslintrc:

  settings: {
    react: {
      version: '999.999.999',
    },
  },

But obviously that is not optimal if we'd like to use this config for client projects that might not be using React.

Potential Solutions

Could we use extends to create a more modular structure for our eslint config(s)? For example, if we had the following configurations:

• eslint-config-sparkbox
• eslint-config-sparkbox-react
• eslint-config-sparkbox-vue

☝️ the React and Vue specific configs could both inherit from the base eslint-config-sparkbox config. However, in order to do this, we'd probably need to remove our dependence on the airbnb config, or switch to using the base airbnb config as a starting point