Я борюсь с незначительной проблемой с моей эскинтой, она работает отлично, но есть некоторые случаи, когда она не работает с 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
Это определенно подбирает мой конфиг, поскольку он реагирует, когда я изменяю какое-то правило.