Im Gegensatz zu Webstorm kann ich JSX-Code in .js
Dateien im Visual Studio-Code nicht auskommentieren .
80
Im Gegensatz zu Webstorm kann ich JSX-Code in .js
Dateien im Visual Studio-Code nicht auskommentieren .
Antworten:
Sie können JSX mit {/ ** /} auskommentieren
Beispiel:
render() { return ( <div> <Component1 /> {/* <Component2 /> */} </div> ) }
und dann würde Komponente2 auskommentiert
quelle
Versuchen Sie, alle Plugins zu deaktivieren, da sie das Verhalten des Editors ändern können. Wenn Sie beispielsweise das Babel ES6 / ES7- Plugin verwenden, kommentiert der Editor die
.jsx
Syntax von//
anstelle von{/*
. Sie sehen das Problem hier .quelle
{/* */}
mehrere Wochen lang angewendet wurde , aber dann nicht mehr funktionierte. Ich habe Babel ES6 / ES7 gestern installiert, also habe ich nur versucht, es zu deinstallieren, und es ist nicht wieder normal. Irgendeine Hilfe?Suche
Babel JavaScript
im VS-Code:https://marketplace.visualstudio.com/items?itemName=mgmcdermott.vscode-language-babel
Installiere und
command + /
kommentiere jsx mit{ /* */ }
quelle
In
Visual Studio code
Hit,Cmd + /
wenn Sie auf einem Mac oder einem Ort laufen{/* Your Code */}
Vielen Dank.
quelle
Die Tastaturbefehle ...
Ctrl + /
- Windows & LinuxCmd + /
- MacOS... arbeiten jetzt wie erwartet für Einzelzeilen- und Blockcode, indem Sie
{/* */}
die ausgewählten Zeilen hinzufügen .Es wurde in den letzten Insider-Builds von Visual Studio Code behoben und wird in die nächste vollständige Version aufgenommen.
quelle
{/ * das funktioniert, aber nur einzeilig * /}
quelle
{/*
nur in der ersten und*/}
nur in der letzten Zeile).Ich hatte das gleiche Problem, bis ich die Dateisprache in Typescript React (Typoskriptreaktion) konvertierte.
Wenn Sie dies als Sprache für alle .js-Dateien konfigurieren möchten, fügen Sie dies Ihrer settings.json hinzu (entweder global oder auf Projektebene in /.vscode/settings.json).
"files.associations": { "*.js": "typescriptreact" }
quelle
Wenn Sie einen JSX-Syntaxblock kommentieren möchten, können Sie dies tun
{ /* <section> <header><h3>Contact Form</h3></header> <figure> <Form /> </figure> </section> */ }
quelle
Das funktioniert auch
{ //this.props.user.profileImage //? <img // src={ this.props.user.profileImage }! // alt="" // /> //: <FontAwesome name='smile-o' /> }
quelle
Derzeit kann dies in Visual Studio-Code durch Drücken der Kombination - Umschalt + Alt + A und Kommentieren des von ihm erzeugten "jsx" -Codes - {/ ** /} Kommentare erfolgen.
quelle
Wenn wir
cmd + /
standardmäßig auf vs Code drücken, werden einzeilige Kommentare erstellt, die für JSX nicht angewendet werden können. Installieren Sie einfach die unten stehende vs Code-Erweiterung, es wird in Ordnung sein.vscode-language-babel
quelle
In React "{}" können wir JavaScript-Ausdrücke verwenden, sodass wir die Art und Weise kommentieren können, wie wir es in JavaScript tun.
Beispiel:
{/* multi line comment */} {// single line comment }
quelle
Verwenden Sie für Linux für eine einzelne Zeile Ctrl+ /.
Wählen Sie für mehrzeilige Dateien die Snippets in VSCode aus. Drücken Sie einfach die Ctrl+ Shift+ A.
Es klappt. Viel Spaß beim Codieren
quelle
Ich habe einige Stunden mit diesem Problem verbracht, und die einfachste Lösung, die ich gefunden habe, ist die folgende: Ja, das Problem tritt bei der Installation der Babel ES6 / ES7-Erweiterung auf, wie viele bemerkt haben. Wenn Sie sie deinstallieren oder deaktivieren, ruft VScode das normale Verhalten ab: Strg + / => Zeilenkommentar für Zeile oder Block
//
umschalten, die mit für JS-, JSX-, ... -Dateien ausgewählt wurden; Umschalt + Alt + A => Blockkommentar für Zeile oder Block umschalten, die zwischen<!--
-->
in HTML-Dateien, zwischen/*
*/
in JS-Ausdrücken und zwischen ausgewählt sind{/*
*/}
in JSX-Dateien für Markup-Tags in Render / Return ... Wenn Sie also die Babel ES6 / ES7-Erweiterung aktiv lassen möchten und dennoch ein solches Verhalten haben möchten, können Sie Ihre eigene Tastenkombination für die Tastenkombination in der Datei keybindings.json (Datei) parametrieren / Einstellungen / Tastaturkürzel (oder Strg + K + S) und klicken Sie dann auf das kleine Dateisymbol oben rechts, um Tastaturkürzel öffnen auszuwählen, mit denen keybindings.json geöffnet wird. Verwenden Sie dazu den integrierten VScode-Befehl "editor.action.insertSnippet". wie folgt:[ { "key": "shift+alt+a", "command": "editor.action.insertSnippet", "args": { "snippet": "{/*\n ${TM_SELECTED_TEXT} \n*/}$0" }, "when": "editorLangId == 'javascript' && editorTextFocus && !editorReadonly" } ]
Platzieren
/n
Sie die gewünschte Stelle im Ausdruck für das Unterbrechen von Linien und die$0
endgültige Platzierung des Cursors. Speichern Sie dann, und es funktioniert direkt :) Nur in JS- und JSX-Dateien Wenn Sie eine andere Sprache angeben möchten, ersetzen Sie'javascript'
den"when"
Ausdruck einfach durch die gewünschte Sprache aus dieser Liste der VScode-Sprachkennungen: https://code.visualstudio.com/docs / language / identifiers # _known-language-identifiers Und natürlich, wenn Sie ein anderes Snippet-Verhalten wünschen: Ersetzen{/*
Sie einfach das, was Sie im"args"
Ausdruck wollen.quelle
=> So kommentieren Sie eine ausgewählte einzelne oder mehrere Codezeilen:
Wählen Sie für Windows- oder Linux- Computer den Code aus und verwenden Sie:
Ctrl + /
um ein Kommentarmuster zu erhalten //Ctrl + Shift + A
um ein Kommentarmuster zu erhalten {/ * * /}Wählen Sie für Mac- Computer den Code aus und verwenden Sie:
Cmd + /
um ein Kommentarmuster zu erhalten //Cmd + Shift + A
um ein Kommentarmuster zu erhalten {/ * * /}=> Um Kommentar- der kommentierten Zeile (n) Code: Einfach den Schritt wiederholen, verwendet man für die Kommentare.
quelle
Ich deinstalliere SUBLIME BABEL JOSH PENG und es funktioniert
Vorher: //
Nach:
{/ * * /}
mit React JavaScript und es funktioniert :-)
quelle