Как исправить «реакция/jsx-close-bracket-location» в WebStorm

Question

Как исправить ошибку react/jsx-closing-bracket-location в WebStorm (Idea, PhpStorm и т. Д.)?

Проблема:

getElem(name) { 
    return (<input type="text" 
     value={this.state.value} 
    />); 
    } 

Этот блок будет выдавать ошибку:

The closing bracket must be aligned with the opening tag (expected column 13) react/jsx-closing-bracket-location

(Документах для react/jsx-closing-bracket-location)

тот же блок без этой проблемы:

getElem(name) { 
    return (<input type="text" 
     value={this.state.value} 
      />); 
    } 

P.S. Я не разрешается изменять eslint правил

Answer 1

Вы не можете настроить WebStorm для автоматического форматирования коды в соответствии с этим правилом, вот запрос сопутствующей функции: https://youtrack.jetbrains.com/issue/WEB-19721

Но WebStorm не нарушит форматирование, если вам уже сформирован такой код.

Вы можете либо форматировать его так вручную, либо использовать параметр ESLint --fix (нажать alt-enter при ошибке и выбрать Fix with ESLint или запустить eslint --fix filename в терминале).

Answer 2

Я столкнулся с этой же проблемой. Вот мой код:

<input 
    className="input__field input__field--haruki" 
    type="text" id="input-1" 
    onFocus={this.onFocus} 
    onBlur={this.onBlur}/> 

Для работы я сделал это:

Просто создал новую линию с /> совмещена с первоначально биркой.