Антон Спирин

ESLint тут не причем и это не ошибка, а warning. Это плагин styled-components или анализатор, который использует этот плагин в webstorm выкидывает предупреждение, так как у вас не явно объявлен медиа запрос и он не может сопоставить его тип. Предлагаю забить.

1. Переименуйте все индексные файлы вindex.jsв нижнем регистре.
2. Соблюдайте регистр в путях при импортах.

const { id } = this.state;

Еще из примера не понятно зачем вы задаете данные массивом и делаете деструктуризацию. Такая структура тяжелей читается и поддерживается, а создание массива и деструктуризация, в этом случае, лишняя операция. Правильней будет так:

const { id } = this.state;
const newOrder = { id, ... };
const orders = [];

ставьте плагин eslint-plugin-react. Дополнительно если не установлены:
eslint
babel-eslint
eslint-plugin-jsx-a11y
eslint-plugin-import
eslint-config-prettier
eslint-config-airbnb
eslint-plugin-prettier
Добавляйте так:

{
  "extends": [
    "airbnb",
    "prettier",
    "prettier/react"
  ],
  "plugins": [
    "prettier"
  ],
  "parser": "babel-eslint",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "env": {
    "browser": true,
    "node": true
  },
  "rules": {
    "no-plusplus": 0,
    "no-confusing-arrow": 0,
    "no-restricted-syntax": 0,
    "guard-for-in": 0,
    "class-methods-use-this": 0,
    "jsx-a11y/no-static-element-interactions": 0,
    "jsx-a11y/anchor-is-valid": 0,
    "react/no-danger": 0,
    "react/prop-types": 0,
    "react/jsx-filename-extension": 0,
    "react/jsx-curly-brace-presence": ["error", { "props": "never", "children": "never" }],
    "import/no-unresolved": ["error", { "commonjs": true }],
    "import/extensions": 0,
    "import/no-extraneous-dependencies": ["error", {"devDependencies": true}],
    "import/prefer-default-export": 0,
    "prettier/prettier": ["error", {
      "singleQuote": true,
      "trailingComma": "all"
    }]
  }
}

Правила настройте под себя.

Если хотите precommit проверку, то поставьте lint-stаged и husky, и добавьте следующие строки в package.json:

"scripts": {
    // ваши скрипты
    "precommit": "./node_modules/.bin/lint-staged",
  },
  "lint-staged": {
    "**/*.js": [
      "./node_modules/.bin/prettier --write",
      "./node_modules/.bin/eslint --fix",
      "./node_modules/.bin/stylelint './app/**/*.js'", // если используете  css in js
      "git add"
    ]
  },

Теперь перед каждым вашим коммитом код будет приводиться в порядок на автомате если это возможно. И прерывать коммит ошибкой если нарушены правила.

Поставьте prettier.
Добавьте его в .eslintrc:

{
  "extends": [
    "airbnb",
    "prettier",
  ],
  "plugins": [
    "prettier"
  ],
  "parser": "babel-eslint"
}

Исправить код можно командой:
prettier --write

"parser": "babel-eslint",
"parserOptions": {
   "ecmaFeatures": {
     "jsx": true
   }
 },

1. Надо установить сам Eslint в зависимости проекта (глобально его обычно не ставят):
npm install eslint --save-dev
2. Если надо, установить конфиги и плагины.
Советую поставить конфиг eslint-config-airbnb и плагин eslint-plugin-prettier.
3. Если используете Flow или экспериментальные фишки JS, ставьте парсер babel-eslint.
4. Создать файл правил .eslintrc. Пример:

{
  "extends": [
    "airbnb",
    "prettier",
  ],
  "plugins": [
    "prettier"
  ],
  "parser": "babel-eslint",
  "rules": {
      /* тут пишите правила, 
       * так же при использовании конфигов,
       *  вам скорей всего захочется какие-то 
       * правила, используемые в них, отключить,
       * это можно сделать тут
       */
  }
}

5. Прописать в своей IDE путь к Eslint и файлу конфигурации, Webstorm находит конфигурацию и локальный ESLint в проекте сам. Как это сделать в NotePad++ поищите сами, скорей всего в репозитории или на сайте плагина есть руководство по настройке и полная документация.