Jak ustawić WebStorm w dopasowaniu wcięcia do zamykających tagów tak, aby pasowały do ​​rodzica podczas korzystania z JSX Harmony?

Question

Próbuję przejść z Visual Studio 2015 do IntelliJ WebStorm 10.0.4.

Po kilku badaniach Google, stwierdziłem, że muszę zmienić język JavaScript na JSX Harmony, aby uzyskać poprawną składnię JSX.

Teraz stwierdzam, że wcięcie znaczników zamykających staje się prawdziwym bólem.

Na przykład, jeśli napiszę poniżej, kiedy idę do zamknięcia tagu <div>, umieszcza go na następnej linii na poziomie wcięcia. W porządku, ale spodziewam się, że po ukończeniu tagu automatycznie dopasuje się do tego samego poziomu wcięcia, co odpowiadający mu tag otwierający. Jest to zachowanie w Visual Studio 2015.

'use strict'; 

var React = require('react'); 

var MyComponent = React.createClass({ 
    render: function() { 
     return (
      <div> 
       </div> //The indentation is wrong here after completing the tag. 
     ); 
    } 
}); 

module.exports = MyComponent; 

wiem, że mogę zrobić kod sformatować z Ctrl + Alt + L ale nie chcą tego robić cały czas .

Próbowałem już z JSLintem i JSHintem, ale nie wydają się dobrze wspierać JSX. Próbowałem również z ESLint, ale wydaje się trochę błędny, a także nie rozwiązuje tego problemu (czy powinien?).

Czy skonfigurowałem coś niepoprawnie? Czy istnieje sposób, aby skonfigurować to zachowanie w WebStorm?

Answer 1

Myślę, że są 2 rozwiązania:

Prostym sposobem jest wpisanie <div, to IDE będzie pokazać opcje. Wybierasz słowo "div" i gotowe.

Innym sposobem jest wygenerowanie "Live template" w preferencjach WebStorm. Możesz użyć fragmentu, zamiast pisać go za dużo. Możesz również "później użyć szablonu na żywo".