Heim >Web-Frontend >js-Tutorial >Formatierung und Linting für Konsistenz
Diese Aktivität beinhaltet die Implementierung statistischer Analysetools in mein Open-Source-Projekt GENEREADME, um die Codequalität und -konsistenz zu verbessern.
Beiträge zu GENEREADME sind willkommen! Bitte besuchen Sie CONTRIBUTING.md für Richtlinien zum Einrichten der Umgebung, zum Ausführen und Testen des Tools und zum Einreichen von Änderungen.
GENEREADME ist ein Befehlszeilentool, das eine Datei aufnimmt, verarbeitet und eine README-Datei mit einer Erklärung oder Dokumentation des Inhalts der Datei generiert. Das Tool nutzt die OpenAI-Chat-Vervollständigung, um die Datei zu analysieren und Inhalte zu generieren.
Das Tool unterstützt derzeit Groq und OpenRouter, das standardmäßig Groq verwendet. Es muss ein gültiger API-Schlüssel für den entsprechenden Anbieter bereitgestellt werden.
Geben Sie einen gültigen API-Schlüssel an, indem Sie entweder eine .env-Datei erstellen oder das Flag -a oder --api-key verwenden, wenn Sie den folgenden Befehl verwenden:
API_KEY=API_KEY or genereadme <files> -a API_KEY genereadme <files> --api-key API_KEY
Installieren Sie die Abhängigkeiten:
npm install -g
Führen Sie das Tool mit den vorhandenen Beispieldateien aus oder beginnen Sie mit der Verwendung Ihrer eigenen:
genereadme <files> genereadme examples/sum.js genereadme examples/createUser.js…
Als Formatierer habe ich mich für Prettier entschieden. Aus einfachen Gründen habe ich mich dafür entschieden, weil ich die Grundfunktionen einfach schon einmal verwendet habe und ich vorhabe, mehr darüber zu lernen.
Technisch gesehen habe ich meine IDE bereits so eingerichtet, dass sie standardmäßig Prettier verwendet, sodass ich meinen Formatierer bereits von Anfang an hatte. Dank der nun schöneren Einrichtung im Projekt selbst können Mitwirkende jedoch auch den Formatierer verwenden, sodass der Code des Projekts hinsichtlich der Formatierung konsistent bleibt.
Ich habe einfach die Regeln hinzugefügt, wie der Code in meiner .prettierrc-Datei formatiert werden soll, und einige Einstellungen in „settings.json“ unter „.vscode/“ für Optionen wie Formatierung beim Speichern.
Für meinen Linter habe ich mich für die Verwendung von ESLint entschieden. Da ich JavaScript verwende, habe ich einen der beliebten Linters verwendet, mit dem ich auch schon Erfahrung hatte, den ich aber nicht wirklich selbst eingerichtet habe. Aus diesem Grund habe ich mich für ESLinter entschieden.
Das Einrichten von ESLinter war nicht wirklich kompliziert. Eine einfache Installation und das Einrichten der Regeln in eslint.config.js reicht aus, um den Linter zum Laufen zu bringen. Da ich jedoch gleichzeitig einen Formatierer und einen Linter verwende, muss ich sicherstellen, dass beide ordnungsgemäß zusammenarbeiten können. Dazu gehören grundsätzlich zusätzliche Regeln, um sicherzustellen, dass es zu keinen Konflikten mit Linter und Formatter kommt.
Es gibt viele Möglichkeiten, die Tools im Projekt zu verwenden, und ich persönlich bevorzuge diese spezifischen Konfigurationen: Formatieren beim Speichern für Prettier und Ausführen beim Tippen für Eslint. Auf diese Weise prüft der Linter während der Eingabe durch den Entwickler immer, ob Flusenprobleme vorliegen, und der Formatierer formatiert die Änderungen dann automatisch, wenn ein Speichervorgang ausgelöst wird.
Für die Aufgabe dieser Woche habe ich jedoch auch Skripte hinzugefügt, damit der Benutzer den Formatierer und Linter manuell über die CLI ausführen kann. Außerdem ist ein Pre-Commit-Hook implementiert, um sicherzustellen, dass jeder in das Repository übertragene Code den Formatierungs- und Linting-Standards des Projekts entspricht. Durch das Hinzufügen dieses Hooks kann ich Prettier und ESLint vor jedem Commit automatisch ausführen, um Probleme frühzeitig zu erkennen und die Codekonsistenz über alle Beiträge hinweg aufrechtzuerhalten. Dieses Setup trägt dazu bei, die Wahrscheinlichkeit zu verringern, dass kleinere Formatierungsprobleme durchgehen, und verbessert die Lesbarkeit des Codes für alle, die am Projekt arbeiten.
Das obige ist der detaillierte Inhalt vonFormatierung und Linting für Konsistenz. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!