Vor kurzem habe ich begonnen, Visual Studio Code für meinen Editor zu verwenden und den Prettier - JavaScript Formatierer gefunden. Ich denke, es ist ein großartiges Plugin, weil es mir hilft, meinen Code schön zu halten.
Ich habe Airbnb's ESLint config eingerichtet und finde das super hilfreich.
Hier ist der Haken. Die Airbnb ESLint Konfiguration, die ich gerade aktiviere, spielt mit Prettier nicht gut. Zum Beispiel ist Prettier für JavaScript-Strings so formatiert, dass sie doppelte Ticks und Airbnbs ESLint wie einzelne Ticks enthält. Wenn ich den Code mit Prettier formatiere, stimmt Airbnbs ESLint nicht überein.
Ich weiß, dass Kent Dodds einige Arbeit mit ESLint-Konfigurationen geleistet hat, unter anderem Beispiel hier.
Aber ich kann anscheinend keine Lösung finden, die es mir erlaubt, die Magie von Prettier zu benutzen, um meinen Code zu Airbnbs ESLint zu formatieren.
Ich denke eslint-config-prettier wurde nur für diesen Zweck erstellt: Ссылка
Grundsätzlich schaltet alle Regeln aus, die mit Code-Styling zu tun haben weil prettier
sich sowieso darum kümmern wird.
Also installierst du dieses Plugin zusammen mit einem anderen gewünschten eslint Plugin (wie eslint-config-airbnb
) und fügst es einfach in dein eslint config zum extends
Feld ein. Zum Beispiel:
Hier sind ein paar Möglichkeiten, um es zu tun, in der Reihenfolge der Empfehlung. Ich würde den ersten Ansatz bevorzugen, da Sie sich nie mit anderen Regeln auseinandersetzen müssen, die in Zukunft Konflikte verursachen könnten.
i) Installieren Sie eslint-config-prettier
und erweitern Sie es in .eslintrc
. Dadurch werden einige Formatierungsregeln in ESLint deaktiviert, die möglicherweise einen Konflikt mit Prettier verursachen:
ii) Hinzufügen von "singleQuote": true
zur .prettierrc
config-Datei:
iii) Hinzufügen einer --single-quote
Befehlszeilenoption beim Aufruf von Prettier:
iv) Deaktivieren Sie die quotes
-Regel von ESLint in Ihrer .eslintrc
config-Datei (und möglicherweise anderen, die Konflikte verursachen könnten):
Sie haben also Ihre .eslintrc-Datei mit der Eigenschaft "extends": "airbnb"
Fügen Sie eine weitere Eigenschaft, Regeln und die Regeln, die Sie dort schreiben, überschreiben die von airbnb geerbten
Nun, hier überschreibe ich nur zwei zufällige Regeln, Sie müssen nach der suchen, die Sie brauchen:)
Oder habe ich Ihre Frage missverstanden?
Tags und Links javascript visual-studio eslint eslint-config-airbnb prettier