Über Axe DevTools Linter
Überblick über Axe DevTools Linter und diese Dokumentationsseite
Was ist Linting?
Linting ist der automatisierte Prozess der Analyse von Quellcode, um Probleme zu finden, bevor der Code ausgeführt wird. Ein Linter ist ein Werkzeug, das Ihren Code liest und Probleme aufzeigt, von Syntaxfehlern und Tippfehlern bis hin zu stilistischen Inkonsequenzen und potenziellen Bugs.
Der Begriff stammt von einem Unix-Tool namens lint, das ursprünglich C-Programme auf verdächtige Konstrukte überprüfte. Heute gibt es Linter für nahezu jede Programmiersprache und sie dienen als erste Verteidigungslinie für Code-Qualität.
Stellen Sie sich einen Linter wie eine Rechtschreibprüfung für Code vor, außer dass er nicht nur Tippfehler entdeckt, sondern auch logische Fehler erkennt, Stilregeln durchsetzt und vor Mustern warnt, die wahrscheinlich Bugs verursachen.
Was ist ein Accessibility Linter?
Ein Accessibility Linter überprüft auf potenziell schlechte Praktiken im Bereich Barrierefreiheit und gibt Ihnen Feedback, während Sie entwickeln, anstatt erst nachdem Ihre Website oder Anwendung erstellt und läuft.
Was Axe DevTools Linter tut
Axe DevTools Linter führt eine statische Analyse Ihrer Quelldateien durch. Es liest Ihren Code und prüft ihn gegen Deque's Regeln, um Muster zu identifizieren, die wahrscheinlich Zugänglichkeitsprobleme verursachen. Zum Beispiel kann es Folgendes erkennen:
- Bilder ohne alternativen Text
- Formulareingaben ohne Beschriftungen
- Falsche oder fehlende ARIA-Attribute
- Probleme mit der Überschriftenstruktur
Da es den Quellcode anstatt einer laufenden Anwendung analysiert, kann Axe DevTools Linter diese Probleme früh erkennen, bevor der Code zusammengeführt, bereitgestellt oder sogar kompiliert wird.
Was Axe DevTools Linter nicht tun kann
Da Axe DevTools Linter ein statisches Analysetool ist, kann es nicht:
- Das Laufzeitverhalten Ihrer Anwendung testen, wie z.B. dynamisch geladene Inhalte oder von JavaScript gesteuerte UI-Änderungen.
- Jedes Barrierefreiheitsproblem erfassen; statische Analyse deckt nur eine Teilmenge der erkennbaren Defekte ab, und einige Probleme erfordern browserbasierte Tests oder manuelle Überprüfung.
- Manuelle Barrierefreiheitstests oder browserbasierte Werkzeuge ersetzen.
Unterstützte Technologien
Axe DevTools Linter kann die folgenden Dateitypen überprüfen:
| Technologie | Dateierweiterungen |
|---|---|
| React | .js, .jsx, .tsx |
| Vue | .vue |
| Angular | .component.html |
| HTML | .html, .htm, .xhtml |
| LiquidJS | .liquid |
| HTL (Adobe Experience Manager) | .htl |
| Markdown | .md, .markdown |
| React Native | Siehe Axe DevTools Linter für React Native |
Möglichkeiten zur Nutzung von Axe DevTools Linter
Axe DevTools Linter kann je nach Arbeitsablauf auf verschiedene Arten verwendet werden:
IDE-Erweiterungen bieten Echtzeit-Feedback, während Sie Code schreiben. Die VS Code-Erweiterung (auch verfügbar für mit VS Code kompatible KI-IDEs wie Cursor und Windsurf) und JetBrains-Plugin (WebStorm und IntelliJ IDEA Ultimate) zeigen Zugänglichkeitsprobleme direkt in Ihrem Editor an, während Sie tippen.
Der Connector ist ein Kommandozeilen-Tool zum Linten von Dateien im Batch, in Skripten oder als Teil einer CI/CD-Pipeline. Siehe Verwendung des Axe DevTools Linter Connectors.
Die GitHub-Aktion überprüft Dateien, die in einem Pull-Request geändert wurden, und meldet Zugänglichkeitsprobleme. Siehe Die Axe DevTools Linter GitHub-Aktion.
Andere CI/CD-Integrationen umfassen Jenkins, SonarQube und Git pre-commit hooks.
Wo die Analyse ausgeführt wird
Lokales Linting: Die VS Code-Erweiterung, das JetBrains-Plugin und der Connector (mit der --local-Option) führen eine Zugänglichkeitsanalyse auf Ihrem eigenen Rechner durch. Datei-Inhalte verlassen niemals Ihren Computer.
Server-basiertes Linting: Der Connector kann Ihre Dateien auch an einen Axe DevTools Linter-Server zur Analyse senden. Dies ist der Ansatz, den die GitHub-Action verwendet. Es gibt zwei Server-Optionen:
- Deque-gehostetes SaaS: Deques Cloud-Server. Erfordert einen API-Schlüssel; keine Server-Installation nötig.
- Vor Ort: Ein Server, den Sie in Ihrer eigenen Infrastruktur betreiben. Siehe Installation und Sicherheit.
Für Anleitungen zur Auswahl zwischen lokalem und serverbasiertem Linten mit dem Connector, siehe Lokales Linting.
Dokumentationsübersicht
Die richtige Einrichtung für Axe DevTools Linter wählen hilft Ihnen, das passende Bereitstellungsmodell, die geeigneten Integrationen und Konfigurationen für den Arbeitsablauf Ihres Teams zu bestimmen.
Einen Axe DevTools Linter SaaS API-Schlüssel erhalten zeigt Ihnen, wie Sie einen Schlüssel erhalten, um auf Deques cloudbasierten Linting-Dienst zuzugreifen.
Zugänglichkeitsregeln listet alle Regeln auf, die Axe DevTools Linter überprüft, mit Links zu detaillierten Informationen auf Deque University.
Konfiguration des Axe DevTools Linters behandelt die Konfigurationsoptionen, die in der VS Code-Erweiterung, im JetBrains-Plugin, im Axe DevTools Linter Connector und im REST-API-/lint-source-Endpunkt verfügbar sind.
Installation und Sicherheit enthält Artikel zum Installieren des lokalen Servers und zum Absichern mit NGINX als Reverse Proxy.
Verwendung des Axe DevTools Linters deckt die verschiedenen Integrationen ab: die JetBrains-Plugin, VS Code-Erweiterung, Connector CLI, GitHub-Aktion, Pre-Commit-Hook, Jenkins und SonarQube.
Linting benutzerdefinierter Komponenten diskutiert die Unterstützung von Axe DevTools Linter für benutzerdefinierte Komponenten, mit Anleitungen für VS Code und JetBrains-Benutzer und REST-Endpunkt-Benutzer sowie einem Artikel über vorkonfigurierte Komponentenbibliotheken.
Entwicklung mit den REST-APIs beschreibt, wie man programmgesteuert auf Axe DevTools Linter mittels seiner REST-Schnittstelle zugreift.
Credits bietet Quellenangaben und Lizenzinformationen für Drittanbieter-Software, die von Axe DevTools Linter verwendet wird.
Note: It is never necessary to use Deque's software or services in a way that collects, stores, or shares personal data. Do not use the software or services in a manner that collects, stores, or shares personal data.