如何在VSCode中的.js文件中注释jsx代码？

Question

与webstorm不同，我无法在Visual Studio Code中的.js文件中注释jsx代码。

Answer 1

您可以通过{/ ** /}注释掉JSX

示例：

render() {
  return (
    <div>
      <Component1 />
      {/* <Component2 /> */}
    </div>
  )
}

然后将注释掉Component2

Answer 2

如果我们默认按cmd + /而代码将执行单行注释，这些注释不能应用于JSX。只需安装以下vs代码扩展即可。

vscode-language-babel

Answer 3

在React中，“{}”允许我们使用JavaScript表达式，因此我们可以用JavaScript的方式来评论。

例：

{/* multi 
line 
comment 
*/}

{// single line comment
}

Answer 4

对于Windows：

评论选定的行

编辑>切换线条注释或Ctrl + /或在行前添加//

输出：//Some Lines of Code here

评论选择块：

编辑>切换块注释或Shift + Alt + A.

输出：/*Some Code here*/ 对Uncomment执行相同的操作

Answer 5

尝试禁用所有插件，因为它们可以更改编辑器的行为。例如，如果使用Babel ES6/ES7插件，编辑器会通过.jsx而不是//来评论{/*语法。你看到问题here。

Answer 6

在Visual Studio code命中Cmd + /，如果你在mac或地方运行

{/* Your Code */}

谢谢。

Answer 7

键盘命令......

Ctrl + / - Windows和Linux Cmd + / - MacOS

...现在，通过在所选行周围添加{/* */}，可以按单个行和块代码的方式工作。

它在最近的has been fixed Insiders builds of Visual Studio Code，并将进入下一个完整版本。

Answer 8

{/ *这个有效，但只有单行* /}

Answer 9

如果你想评论JSX语法块，你可以这样做

{
  /* <section>
     <header><h3>Contact Form</h3></header>
     <figure>
       <Form />
     </figure>
   </section> */
}

Answer 10

这也有效

{
  //this.props.user.profileImage
  //? <img
  //    src={ this.props.user.profileImage }!
  //    alt=""
  //  />
  //: <FontAwesome name='smile-o' />
}

Answer 11

在将文件语言转换为Typescript React（typescriptreact）之前，我遇到了同样的问题。

如果要将其配置为所有.js文件的语言，请将其添加到settings.json（全局或在/.vscode/settings.json中的项目级别）。

"files.associations": {
    "*.js": "typescriptreact"
  }

Answer 12

目前在Visual Studio代码中可以通过按下组合来完成 - Shift + Alt + A并注释它产生的“jsx”代码 - {/ ** /}注释。