Automatisches Ersetzen von VSCode in einfachen bis doppelten Anführungszeichen

94

Wenn ich einen Format DocumentBefehl für eine Vue Component.vue-Datei ausführe, ersetze VSCode alle Zeichenfolgen in einfachen Anführungszeichen durch Zeichenfolgen in doppelten Anführungszeichen.

In meinem speziellen Fall widerspricht diese Regel der Konfiguration von Elektronen-Flusen, für die ein einfaches Anführungszeichen erforderlich ist.

Ich habe keine schöneren Erweiterungen installiert (nein prettier.singleQuotein meiner Einstellung)

Wie kann ich VSCode anpassen, um dies zu vermeiden?

attdona
quelle

Antworten:

128

Ich habe keine prettierErweiterung installiert, aber nachdem ich die mögliche doppelte Antwort gelesen habe, die ich in meiner Benutzereinstellung ( UserSetting.json, Strg +, Verknüpfung) von Grund auf hinzugefügt habe :

"prettier.singleQuote": true

Bei einem Teil einer grünen Warnung ( Unknown configuration setting) werden die einfachen Anführungszeichen nicht mehr ersetzt.

Ich vermute, dass die schönere Erweiterung nicht sichtbar ist, sondern in die Vetur- Erweiterung eingebettet ist .

attdona
quelle
2
Das hat bei mir nicht funktioniert. Ich musste vetur.format.defaultFormatterOptionsstattdessen verwenden. Siehe https://vuejs.github.io/vetur/formatting.html#settings .
user1620220
Geben Sie nach dem Öffnen der Schnellsuche "> Benutzereinstellungen" ein und klicken Sie auf "Einstellungen: Benutzereinstellungen öffnen". Geben Sie im Suchfeld Ihrer Einstellungen "prettier.singleQuote" ein und aktivieren Sie das Kontrollkästchen für ein hübscheres einfaches Anführungszeichen.
Kody
3
Dies hat bei mir nicht funktioniert, quote_type = singleim [*.myDesiredFileExtension]Abschnitt innerhalb der .editorconfigDatei war die Lösung.
Einsamer
73

Nun, wie der Typ (@ user2982122) erwähnt hat, aber anstelle von Datei gehen Sie zu Code -> Einstellungen -> Einstellungen, suchen Sie dann nach Angebot , wählen Sie Schöner und aktivieren Sie beide Kontrollkästchen

Geben Sie hier die Bildbeschreibung ein Geben Sie hier die Bildbeschreibung ein

Mustapha Mekhatria
quelle
1
Müssen Sie diese Einstellungen neu laden, damit sie wirksam werden? Ich habe beide überprüft, aber wenn ich meine .jsx-Datei speichere, ändern sich die doppelten Anführungszeichen nicht in einfache.
J Woodchuck
Das ist komisch, ich benutze diese Version: Release 1.14 Build 1.14.0-17740
Mustapha Mekhatria
52

Für Projekte, die .editorconfigstandardmäßig Dateien verwenden. Der Formatierer ignoriert die Regeln in den Einstellungen und verwendet die Regeln in .editorconfig. Dann können Sie entweder:

  • Entfernen Sie die .editorconfigDatei und verwenden Sie Ihre VSCode-Einstellungen.
  • Fügen Sie quote_type = singleder .editorconfigDatei Ihren Dateityp hinzu. Sie können den quote_typeWert auch auf doubleoder setzen auto.
Gary Lamb
quelle
1
Ich habe dies getan und es hat nicht funktioniert, unabhängig davon, ob ich editorconfig global installiert habe oder ob ich versuche, die editorconfig für VS Code zu verklagen. :(
acarlstein
Vielen Dank, meine Angular-App .editorconfigwird standardmäßig verwendet (wusste das nicht) und Ihre Lösung hat mein Problem
behoben
28

Es sieht so aus, als wäre ein Fehler für dieses Problem offen: Prettier Bug

Keine der oben genannten Lösungen hat bei mir funktioniert. Das einzige, was funktionierte, war das Hinzufügen dieser Codezeile in package.json:

"prettier": {
    "singleQuote": true
  },
Avjol Sakaj
quelle
25

Von der vuejs / vetur-Problemseite https://github.com/vuejs/vetur/issues/986# Diese Lösung hat bei mir funktioniert.

Fügen Sie in der VSCodes- settings.jsonDatei diesen Eintrag hinzu

"vetur.format.defaultFormatterOptions": {
    "prettier": {
        "singleQuote": true
    }
},
Dave Pile
quelle
Das hat bei mir funktioniert.
Azurebean
10

Richtige Lösung:

Ich füge die Datei .prettierrc.js in mein Hauptstammprojekt ein und schreibe

module.exports = {
    singleQuote: true
  };
Omar Hasan
quelle
Ich habe es versucht, aber es wird ein Fehler ausgegeben: "ESLint: Fehler beim Laden der Konfiguration" Standard / Konfigurationen / Eslint "Erweiterung von". Am besten fügen Sie dies in package.json hinzu. Lösung
Avjol Sakaj
Haben Sie Ihre .prettierrc.js-Datei im Stammverzeichnis des Projekts abgelegt?
Omar Hasan
7

Für Neulinge wie mich:

Wählen Sie im Menü Navigationsleiste oben: Datei -> Einstellungen -> Einstellungen. Geben Sie im Suchtextfeld Angebot ein. Suchen Sie in der unten angezeigten gefilterten Liste nach dem Zahnradsymbol und daneben nach "Schöner". Klicken Sie auf das Kontrollkästchen, um "Schöner: Einfaches Angebot" zu aktivieren.

user2982122
quelle
6

Wie von @attdona bemerkt, enthält die Vetur-Erweiterung hübscher.

Während Sie die hübscheren Einstellungen gemäß der akzeptierten Antwort ändern können, können Sie auch den Formatierer für bestimmte Regionen einer Vue-Komponente ändern.

Hier habe ich beispielsweise Vetur so eingestellt, dass der Formatierer vscode-typescript verwendet wird, da standardmäßig einfache Anführungszeichen verwendet werden:

vscode vetur Einstellungen

Richard Banks
quelle
6

Probieren Sie eine dieser Lösungen aus

  1. Fügen Sie in der Datei vscode settings.json diesen Eintrag hinzu "prettier.singleQuote": true
  2. Wenn Sie in vscode eine .editorconfigDatei haben, fügen Sie diese Zeile unter dem Stammsymbol [*] hinzuquote_type = single
  3. Wenn Sie in vscode eine .prettierrcDatei haben, fügen Sie diese Zeile hinzu
{
    "singleQuote": true,
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "singleQuote": true
        }
    }
}
javidabd
quelle
1
Die zweite Option hat funktioniert, leider haben die anderen Antworten auf dieser Seite nicht funktioniert
Mo.
6

Bitte beachten Sie, .editorconfigüberschreibt alles, verwenden Sie:

[*]
quote_type = single
Einsam
quelle
5

Ich hatte das gleiche Problem in vscode. Erstellen Sie einfach eine .prettierrc- Datei in Ihrem Stammverzeichnis und fügen Sie den folgenden json hinzu. Für einfache Anführungszeichen hinzufügen:

{
  "singleQuote": true
}

Für doppelte Anführungszeichen hinzufügen:

  {
      "singleQuote": false
  }
Hamfri
quelle
5

Es gibt nur eine Lösung, die für mich funktioniert hat: und nur für Angular Projects:

Gehen Sie einfach in Ihre Projektdatei ".editorconfig" und fügen Sie 'quote_type = single' ein. Hoffe, es sollte auch für Sie funktionieren.

Muhammad Waqas
quelle
3

Ich habe eine Datei hinzugefügt, die .prettierrcin meinem Projektordner aufgerufen wurde. Dateiinhalt:

{
    "singleQuote": true,
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "singleQuote": true
        }
    }
}
0lukasz0
quelle
2

Sie können dies in settings.json verwenden

"javascript.preferences.quoteStyle": "single"
mperk
quelle
1

Es funktioniert für mich, ein einfaches Anführungszeichen in Prettier sowie tslint.autoFixOnSave als true zu überprüfen

Geben Sie hier die Bildbeschreibung ein

Geben Sie hier die Bildbeschreibung ein

Rudra
quelle
1

Installieren Sie die schönere Erweiterung und fügen Sie den folgenden Code in Ihre VSCode- settings.jsonDatei ein

 "prettier.useEditorConfig": false,
 "prettier.singleQuote": true

Dadurch wird Ihre .editorconfig-Dateieinstellung ignoriert.

Md. Mustafizur Rahman
quelle