Проблемы с отступом Eslint (Airbnb) с кодом React (JSX)

Я борюсь с незначительной проблемой с моей эскинтой, она работает отлично, но есть некоторые случаи, когда она не работает с React кодом.

Возьмем в качестве примера этот код:

const cellPLay = (name, src) => (
  <Table.Cell>
    <Modal trigger={<Button icon><Icon name="video play" size="large" /></Button>}>
      <Modal.Header>
        {name}
      </Modal.Header>
      <Modal.Content image>
        <Modal.Description>
          <video src={src} controls style={{ width: 910 }} />
        </Modal.Description>
      </Modal.Content>
    </Modal>
  </Table.Cell>
);

Дает такие ошибки:

/my-path/MyFile.js:18:7: Ожидаемое отступы 8 символов пробела, но найдено 6. [Ошибка/реакция /jsx-indent]

По какой-то причине eslint думает, что Modal.Content должен быть отступом после Modal.Header, но даже если я исправим все отступы, он спрашивает, что это говорит о том, что отступ некоторых закрывающих тегов неверен:

Ожидаемый закрывающий тег в соответствии с отступом открытия

Мой конфигурационный файл eslint:

{
  "extends": "./my-eslint/index.js"
}

Фактический код eslint:

module.exports = {
  extends: require.resolve('eslint-config-airbnb'),
  env: {
    browser: true,
    jest: true,
    es6: true,
  },
  parserOptions: {
    ecmaVersion: 8,
    sourceType: 'module',
    ecmaFeatures: {
      jsx: true,
    },
  },
  rules: {
    strict: 'error',
    'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx'] }],
    'no-plusplus': 'off',
    'jsx-a11y/media-has-caption': 'off',
    'jsx-a11y/anchor-is-valid': [
      'error',
      {
        components: ['Link'],
        specialLink: ['to'],
      },
    ],
  },
};

Я попытался добавить вручную правило для jsx indent

'react/jsx-indent': [2, 2],

Не разрешил.

Любая другая идея?

С другой стороны, VSCode делал это правильно в отношении отступа, но когда я запускаю eslint вручную, он терпит неудачу, и мне нужно его исправить, потому что есть автоматизация стиля кода. Я последовал за некоторыми ответами и установил на VSCode красивее, кажется, что теперь они попали на одну страницу, но мне нужно исправить проблему с отступом.

ОБНОВЛЕНИЕ 1 Как было предложено @a-jar-of-clay, я попытался обновить свои пакеты, eslint до 5.4.0, airbnb до 17.1.0 и airbnb-base до 13.1.0

Теперь я получил новые сообщения об ошибках, возможно, из-за некоторой несовместимости:

Ошибка: config-airbnb/rules/react.js: Конфигурация для правила "response/jsx-no-bind" недействительна: Значение {"ignoreRefs": true, "allowArrowFunctions": true, "allowFunctions": false, "allowBind": false, "ignoreDOMComponents": true} НЕ должны иметь дополнительных свойств.

ОБНОВЛЕНИЕ 2 Как было задано @matt-dell, команда, которую я запускаю для запуска вручную:

./node_modules/.bin/eslint --fix --format unix  --config my-eslint/index.js

Это определенно подбирает мой конфиг, поскольку он реагирует, когда я изменяю какое-то правило.

Ответ 1