JavaScript schöner machen
Ein schöner Aspekt von Go ist, dass die Sprache vorgibt, wie Code zu formatieren ist. Diskussionen über die Optik von Code gehören damit der Vergangenheit an. Für JavaScript steht mit prettier seit Kurzem nun auch ein Modul zur Verfügung, das die Formatierung vorgibt.
- Golo Roden
Ein schöner Aspekt von Go ist, dass die Sprache vorgibt, wie Code zu formatieren ist. Diskussionen über die Optik von Code gehören damit der Vergangenheit an. Für JavaScript steht mit prettier seit Kurzem nun auch ein Modul zur Verfügung, das die Formatierung vorgibt. Wie funktioniert es?
Wer Code in Go schreibt, kennt das in den Compiler integrierte Werkzeug go fmt, das Quellcode nach den von Google vorgegebenen Regeln formatiert. Zahlreiche Editoren und IDEs binden das Werkzeug zudem ein, sodass Code beim Speichern automatisch formatiert wird.
Natürlich lässt sich über die konkrete Auswahl und Ausgestaltung der Regeln streiten. Unstrittig ist aber, dass diese Diskussion letztlich überflüssig ist, denn go fmt gibt verbindlich vor, wie Code auszusehen hat. Ob der verwendete Stil den persönlichen Geschmack trifft oder nicht, ist Nebensache.
Für Teams hat das den enormen Vorteil, sich nicht auf einen gemeinsamen Stil einigen zu müssen. Er wird von der Sprache vorgegeben. Doch auch einzelne Entwickler profitieren davon. Wenn nämlich jeder Code gleich formatiert ist, muss man sich gedanklich nicht mehr mit der Frage auseinandersetzen, ob einer ungewohnten Formatierung eine besondere Bedeutung innewohnt.
Standard.js ist kein Standard
Für JavaScript gab es ein vergleichbares Werkzeug bislang nicht, zumindest keines, das sich in einem höheren Maß durchgesetzt hätte. Häufig wurde daher auf ESLint zurückgegriffen, womit sich zumindest die Einhaltung der Formatierung verhältnismäßig strikt prüfen lässt, beispielsweise mit dem Modul eslint-config-es. Das führt allerdings lediglich zu einem reaktiven Verhalten, denn proaktiv lässt sich die Formatierung mit ESLint nicht durchsetzen.
Auch der bisher am ehesten erfolgreiche Versuch, eine standardisierte Formatierung für JavaScript zu etablieren, hat sich nicht durchsetzen können: Standard.js stößt mit der Entscheidung, auf Semikolons zu verzichten, bei vielen Entwicklern auf Unverständnis und auf Ablehnung.
prettier = go fmt für JavaScript
Seit kurzem gibt es nun das Modul prettier, das praktisch dem Kommando go fmt für JavaScript entspricht. Es arbeitet auf dem AST und kann daher anders als ESLint in jegliche Formatierung eingreifen. Das beschreibt auch die Dokumentation von prettier entsprechend:
"This goes way beyond ESLint and other projects built on it. Unlike ESLint, there aren't a million configuration options and rules. But more importantly: everything is fixable. This works because Prettier never "checks" anything; it takes JavaScript as input and delivers the formatted JavaScript as output."
Um prettier zu verwenden, muss man es zunächst installieren. Das erfolgt auf dem gewohnten Weg über npm, wobei die globale Installation zu empfehlen ist:
$ npm install -g prettier
Anschließend kann man prettier unter Angabe eines oder mehrerer Dateinamen aufrufen. Zwar gibt es einige wenige Parameter, die meisten davon sollte man aber unangetastet lassen. Ungewöhnlich wirkt lediglich die Präferenz von doppelten Anführungszeichen, was sich aber durch die Angabe des Parameters --single-quote ändern lässt.
Gibt man zusätzlich den Parameter --write an, gibt prettier das Ergebnis nicht nur auf dem Bildschirm aus, sondern aktualisiert auch direkt die angegebenen Quelldateien:
$ prettier --write --single-quote app.js
Integration in den Workflow
Für zahlreiche Editoren und IDEs stehen Plug-ins zur Verfügung, die beispielsweise beim Speichern einer Datei diese automatisch formatieren. Das funktioniert unter anderem für Atom, Visual Studio Code und vi. Für die Integration mit ESLint steht ein Plug-in namens eslint-plugin-prettier zur Verfügung, sodass man bereits während der Eingabe entsprechendes Feedback erhält.
Nimmt man prettier, ein Editor- und das ESLint-Plug-in zusammen, erhält man eine Lösung, die sehr nah an das Vorbild go fmt heranreicht und sich nahtlos in den Workflow integriert.
tl;dr: Das npm-Modul prettier formatiert JavaScript-Code nach vorgegebenen Regeln, ähnlich dem Werkzeug go fmt aus der Programmiersprache Go. Damit gehören Diskussionen zum Stil der Formatierung der Vergangenheit an. ()
