Ü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-Werkzeug namens lint, das ursprünglich C-Programme auf verdächtige Strukturen überprüfte. Heute existieren Linter für nahezu jede Programmiersprache und dienen als erste Verteidigungslinie in der Codequalitä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 vergleicht ihn mit Deque's Regeln , um Muster zu identifizieren, die wahrscheinlich Barrierefreiheitsprobleme 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 VS Code-kompatible KI-IDEs wie Cursor und Windsurf) und das JetBrains-Plugin (WebStorm und IntelliJ IDEA Ultimate) zeigen Barrierefreiheitsprobleme direkt in Ihrem Editor, während Sie tippen.
Der Connector ist ein Kommandozeilenwerkzeug zum Prüfen von Dateien in Batches, in Skripten oder als Teil einer CI/CD-Pipeline. Siehe Verwendung des Axe DevTools Linter Connectors.
Die GitHub-Aktion überprüft Dateien, die in einer Pull-Anfrage geändert wurden, und meldet Zugänglichkeitsprobleme. Siehe Die Axe DevTools Linter GitHub-Aktion.
Andere CI/CD-Integrationen umfassen Jenkins, SonarQubeund 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 die Zugänglichkeitsanalyse auf Ihrem eigenen Rechner aus. Die Dateiinhalte verlassen niemals Ihren Computer.
Server-basiertes Linting: Der Connector kann Ihre Dateien auch zur Analyse an einen Axe DevTools Linter-Server senden. Dies ist der Ansatz, den die GitHub-Aktion verwendet. Es gibt zwei Serveroptionen:
- Deque-gehostetes SaaS: Deques Cloud-Server. Erfordert einen API-Schlüssel; keine Server-Einrichtung 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 Linting mit dem Connector siehe Lokales Linting.
Dokumentationsübersicht
Einen Axe DevTools Linter SaaS API-Schlüssel erhalten zeigt Ihnen, wie Sie einen Schlüssel erhalten, um auf den cloudbasierten Linting-Dienst von Deque zuzugreifen.
Zugänglichkeitsregeln listet alle Regeln auf, die der Axe DevTools Linter überprüft, mit Links zu ausführlichen Informationen auf Deque University.
Konfiguration des Axe DevTools Linters behandelt die verfügbaren Konfigurationsoptionen in der VS Code-Erweiterung, dem JetBrains-Plugin, dem Axe DevTools Linter Connector und der REST-API /lint-source Schnittstelle.
Installation und Sicherheit enthält Artikel über die Installation des Vor-Ort-Servers und seine Sicherung mit NGINX als Reverse-Proxy.
Verwendung des Axe DevTools Linters umfasst die verschiedenen Integrationen: das 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, plus einen Artikel über vorkonfigurierte Komponentenbibliotheken.
Entwicklung mit den REST-APIs beschreibt, wie man programmgesteuert über die REST-Schnittstelle auf Axe DevTools Linter zugreifen kann.
Credits bietet Attribution und Lizenzinformationen für die von Axe DevTools Linter verwendete Drittsoftware.
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.