在使用JSX Harmony时,如何使WebStorm调整结束标记的缩进以匹配其父级?

cru*_*ush 7 intellij-idea jsx webstorm

我正在尝试从Visual Studio 2015切换到IntelliJ WebStorm 10.0.4.

经过一些谷歌搜索,我发现我需要将JavaScript语言切换到JSX Harmony,以使JSX语法工作.

现在,我发现结束标签的缩进正在成为一种真正的痛苦.

例如,如果我编写以下内容,当我关闭<div>标记时,它会将它放在缩进级别的下一行.这很好,但我希望一旦我完成标记,它会自动调整到与其匹配的开始标记相同的缩进级别.这是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;
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述

我知道我可以使用重新格式化代码,Ctrl + Alt + L但我不想一直这样做.

我已经尝试过使用JSLint和JSHint,但它们似乎并不能很好地支持JSX.我也试过ESLint,但它看起来有点儿麻烦,而且,也没有解决这个问题(应该吗?).

我配置错误了吗?有没有办法在WebStorm中配置此行为?

小智 0

我认为有2个解决方案:

简单的方法是输入<div,然后 IDE 会显示选项。您选择“div”一词,就完成了。

另一种方法是在 WebStorm 首选项中生成“实时模板”。您可以使用一个片段而不用输入那么多内容。您也可以稍后谷歌“如何使用实时模板”。