如何在 VSCode 中自动缩进 jsx答案

【问题标题】：How to auto indent jsx in VSCode如何在 VSCode 中自动缩进 jsx
【发布时间】：2017-03-22 18:29:40
【问题描述】：

VSCode 似乎不会在 jsx 中自动缩进 HTML 元素？

有什么办法可以解决。

更新：

在原子中：

当我输入<div> 时，atom 会显示：

我按下return键后，结果是（注意光标的位置）：

在 VSCode 中：

【问题讨论】：

【解决方案1】：

1. 将用户设置添加到

"files.associations": {
    "*.js": "javascriptreact"
},

2。安装插件

Auto Install Tag

然后重新加载。它将解决您的问题。

顺便说一句，我认为现在有一个错误。没有组件 props 自动缩进效果很好，但是有了 props，它现在就不行了。

<Component>Enter

===>

<Component>
    :
</Component>

但是

<Component someProps={10}}Enter

===>

<Component someProps={10}>
:</Component>

任何可以解决此问题的人请帮助我 :) 我在 mac 上使用

【讨论】：

【解决方案2】：

使用 Esben Petersen 的扩展“Prettier - Code formatter”。假设您的文件是 jsx 文件，它将在保存时自动格式化。

【讨论】：

【解决方案3】：

将语言更改为Javascript React（有关说明，请参阅其他答案），然后使用以下命令：

alt + shift + f

【讨论】：

【解决方案4】：

尝试将语言模式更改为 JavaScript React。

完成后，您会在左下角看到 JavaScript React 模式。

进入该模式后，再次尝试格式化文档。

【讨论】：

@zhuscat 你发出什么命令来格式化代码？它适用于我的机器 (TM)。
@zhuscat 啊哈。我以为您在谈论“格式化文档”命令。您的问题更新阐明了您的需求。
我想知道是否有任何方法可以在jsx中自动添加HTML关闭标签
我安装了一个名为auto close tag 的插件来解决“标签补全”问题。但是，press return key 问题（当我按回车键时，我希望与我的问题示例中的
相比多缩进一个）仍然存在。