2019 年：React 直截了当的答案

在 React 项目中获得 JSX/HTML 自动完成的最直接方法是将其添加到您的用户设置或工作区设置 ( <project-path>/.vscode/settings.json)：

      "emmet.includeLanguages": {
        "javascript": "javascriptreact"
      },
      "emmet.triggerExpansionOnTab": true

您可能需要重新启动 VS Code 才能使更改生效。

PS 如果你没有为 React.js 项目做这个映射，那么 KehkashanFazal 的答案可能对你有用。

Visual Studio 代码检测 .jsx 扩展名并默认添加 emmet 支持（我使用的是 VS 代码 1.8.1）

但是，如果您更喜欢对所有 React 文件使用 .js 扩展名 - 您可以将 JavaScript React 模式与 VS Code 窗口右下角的 .js 文件相关联。

如何逐步执行此操作 (gif)

2021 年更新

对于那些只想复制粘贴代码的人：

"emmet.syntaxProfiles": {
  "javascript": "jsx"
}

如果上述解决方案不起作用，请尝试以下操作：

"emmet.triggerExpansionOnTab": true,
"emmet.includeLanguages": {
  "javascript": "javascriptreact"
}

使用 VS Code v1.56.2 测试。

如果有人还在为这个问题苦苦挣扎：

我发现只需设置

"emmet.syntaxProfiles": {
     "javascript": "jsx" 
 },

不启用 HTML 完成。但是，使用：

"emmet.includeLanguages": {
    "javascript": "html"
}

做。

根据emmet 文档：

"emmet.includeLanguages": {}

在默认情况下不支持的语言中启用 emmet 缩写。在此处添加语言和 emmet 支持的语言之间的映射。
例如：{"vue-html": "html", "javascript": "javascriptreact"}

只需在屏幕右下角选择适当的语言模式：将其设置为JavaScript React。

2018年

我正在使用 VSCode (ver 1.27.2)

根据我的经验，即使我正在使用React. 我的检测到的语言VSCode仍然是香草JavaScript。并且 emmet 不起作用。

• 使其再次工作的方法之一是将VSCode检测到的语言更改为JavaScript React. 这仅适用于单个JS文件。

• 要完全更改一次，您需要关联它。

点击 Configure File Association for .js...

并选择JSX，在我的情况下，我已经这样做了。

• 对于工作场所设置，如果它们都不适合您，则最后一次。转到 Preference of just ctrl + , (comma)to 打开它。

键入并搜索emmet或Emmet。然后复制要覆盖的设置。就我而言：

{
    "emmet.triggerExpansionOnTab": true,
    "emmet.includeLanguages": {
        "javascript": "javascriptreact"
    },
}

注意：我没有尝试jsx只使用javascriptreact.

我实施了第二步和第三步。而我现在可以做到Emmet。