ESLint und Prettier: So zentralisiert man die Konfigurationsdateien für einheitliche Coderegeln

In Projekten mit mehreren Entwicklern kommt es immer wieder dazu, dass ganz verschiedene Arten des Programmierens aufeinandertreffen. Hierunter leidet oft die Qualität des Codes. Aus diesem Grund kann man in einem Projekt Konfigurationsdateien mit abgestimmten Regeln anlegen, an die sich jeder halten muss, damit eine hohe Code-Qualität sichergestellt ist.

Aber warum sollte man diese Konfigurationsdateien zentralisieren?

Zentrale Konfigurationsdateien haben einige Vorteile. Entwickler, die in mehreren Projekten arbeiten, müssen sich nicht immer umgewöhnen, sondern es können in allen Projekten die gleichen Regeln existieren. Es geht sehr schnell in einem neuen Projekt die Konfigurationsdateien einzubinden und es können Regeln, die nachträglich geändert oder hinzugefügt werden, direkt in allen Projekten übernommen werden.

Zentrale Konfigurationsdateien für Prettier und ESLint erstellen 

In meinem letzten Blogbeitrag habe ich bereits erläutert, wie man ESLint und Prettier in ein Projekt einbindet.

Diese Konfigurationsdateien und die Angaben in der package.json können wir nun in ein Node.js-Module auslagern.

Wenn man schon für andere Module ein Node.js-Module angelegt hat, kann man dieses für ESLint und Prettier einfach weiterverwenden oder ein neues Node.js-Module anlegen.

Man muss lediglich die Konfigurationsdateien für ESLint und Prettier, die wir in meinem letzten Blogbeitrag erstellt haben, in ein neues Projekt ablegen, die Angaben aus der package.json in das Node.js-Module übertragen und daraus ein Node.js-Module erstellen, sowie dieses anschließend veröffentlichen.

Eine gute Anleitung, wie man ein Node.js-Module erstellt und veröffentlicht, findet man hier.

Konfigurationsdatei aus Node.js-Module in Projekt einbinden 

Nachdem man sein Node.js-Module veröffentlicht hat, kann man in dem gewünschten Projekt den Befehl npm install [Name deines Node.js-Modules] absetzen und hat dieses Module in seinem Projekt installiert.

Nun muss man lediglich die Konfigurationsdateien in den Projekten erstellen, die von der ursprünglichen Konfiguration aus dem Node.js-Module erben.

Die Konfigurationsdateien im Projekt müssen auf der Hauptebene liegen, damit diese automatisch verwendet werden.

Für ESLint muss eine .eslintrc im json-Format angelegt werden.

Diese braucht den folgenden Inhalt:

{
  "extends": "./node_modules/[Name des Node.js-Modules]/.eslintrc.json"
} 

In dieser Datei kann man auch projektspezifische Regeln festlegen oder zentrale Regeln überschreiben.

Für Prettier muss eine .prettierrc.js angelegt werden.

In dieser muss Folgendes stehen:

module.exports = {
  ...require('./node_modules/[Name des Node.js-Modules]/.prettierrc.json')
}; 

Beispiele 

Wie ein fertiges Node.js-Module aussehen könnte, kann man sich hier anschauen.

Das hierzu veröffentlichte Node.js-Module (in meinem Beispiel für TypeScript-Dateien konfiguriert) findet man hier.

Dieses kann man über den Befehl npm i ordix-eslint-and-prettier-config in ein Projekt einbinden.

In einer Beispielanwendung könnt Ihr Euch anschauen, wie das ganze fertig funktioniert. Wenn Ihr Euch das Programm herunterladet, könnt Ihr in der LintTest.ts beliebig Code ergänzen und eines der beiden Lint-Skripte starten.

Der lint-Befehl zeigt Euch, an welchen Stellen gegen die konfigurierten Regeln verstoßen wird.

Der lint:fix-Befehl versucht die auftretenden Fehler automatisch zu beheben.

Fazit 

Mit ein paar wenigen Handgriffen kann man Konfigurationsdateien zentralisieren und erleichtert den Mitarbeitern nicht nur in den aktuellen Projekten die Arbeit, sondern auch in zukünftigen. Man kann die Konfiguration sehr schnell übernehmen und verschwendet keine Zeit mit dem Aufsetzen von neuen Konfigurationsdateien. 

Seminarempfehlungen