web-dev-qa-db-ja.com

VSCodeの.jsファイルでjsxコードをコメントアウトする方法は?

Webstormとは異なり、Visual Studio Codeの.jsファイルでjsxコードをコメントアウトすることはできません。

64
Y.H. Eng

{/ ** /}でJSXをコメントアウトできます

例:

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

そして、Component2はコメントアウトされます

83
erichardson30

すべてのプラグインを無効にしてみてください。エディターの動作を変更する可能性があるためです。たとえば、 Babel ES6/ES7 プラグインを使用する場合、エディターは.jsxではなく//{/*構文をコメントします。問題が表示されます here

16
Andrej Gajdos

Macまたは場所で実行している場合はVisual Studio codeをヒットCmd + /

{/* Your Code */}

ありがとうございました。

キーボードコマンド...

Ctrl + /-WindowsおよびLinux
Cmd + /-MacOS

...選択した行の周りに{/* */}を追加することにより、単一行およびブロックコードで期待どおりに動作するようになりました。

それは 修正済み 最近 Visual Studio Codeのインサイダービルド で、次の完全リリースに組み込まれます。

8
GollyJer

{/ *これは機能しますが、1行のみです* /}

4

JSX構文ブロックをコメントする場合は、次のようにできます。

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

現在、Visual Studioのコードでは、Shift + Alt + Aと生成される「jsx」コードのコメント-{/ ** /}コメントを組み合わせて押すことで実行できます。

2
Sodinikas

ファイル言語をTypeScript React(typescriptreact)に変換するまで、同じ問題がありました。

これをすべての.jsファイルの言語として構成する場合は、これをsettings.jsonに追加します(グローバルに、または/.vscode/settings.jsonのプロジェクトレベルで)。

"files.associations": {
    "*.js": "typescriptreact"
  }
2
5tormTrooper

これも機能します

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

デフォルトでcmd + /を押すと、vs codeはJSXには適用できない単一行コメントを実行します。以下のコード拡張機能をインストールするだけで問題ありません。

vscode-language-babel

0
Manzoor Samad

Reactでは、「{}」によりJavaScript式を使用できるため、JavaScriptで行う方法をコメントできます。

例:

{/* multi 
line 
comment 
*/}

{// single line comment
}
0
Yash P Shah