De Axe Linter-extensie voor VS Code gebruiken
Informatie over het installeren en gebruiken van de extensie met VS Code
De Axe DevTools Linter-extensie voor VS Code stelt je in staat om je code te controleren op toegankelijkheidsproblemen vanuit VS Code en met VS Code-compatibele editors, inclusief AI IDE's zoals Cursor en Windsurf. Je kunt React (JSX), React Native, Angular, Vue, HTML en Markdown controleren op veelvoorkomende toegankelijkheidsfouten.
De extensie verkrijgen
Meestal download je de extensie van de VS Code-extensie marktplaats. Klik op de Installeren knop, waarmee de extensie wordt gedownload en er toestemming wordt gevraagd om VS Code te openen om de extensie te installeren.
Als je VSCodium, een AI-IDE zoals Cursor of Windsurf, of een andere VS Code-compatibele editor gebruikt, kun je de extensie installeren vanuit de Open VSX Register.
Zie Installeren in Beperkte Omgevingen voor andere manieren om de extensie te downloaden en te installeren.
Overzicht van het Gebruik
De extensie markeert toegankelijkheidsfouten in VS Code met een rode golvende lijn en biedt een tooltip die de fout aangeeft. Daarnaast toont het Problemen paneel hieronder (indien ingeschakeld) een lijst van fouten, zoals hieronder weergegeven:
De tooltip en informatie in het Problemen paneel bevatten een link naar Deque University voor meer informatie over de gespecificeerde toegankelijkheidsfout. In het getoonde voorbeeld mist het codevoorbeeld het lang attribuut op het html element, wat besproken wordt op Deque University: html-has-lang.
Configuratie
Het is niet nodig om de extensie te configureren, maar je kunt het gedrag ervan wijzigen door configuratiebestanden te gebruiken. Voor meer informatie, zie:
- Axe DevTools Linter Configureren voor een verwijzing naar de configuratieopties van Axe DevTools Linter
- Linten van Aangepaste Componenten met de Axe Toegankelijkheidslinter voor VS Code of JetBrains IDEs voor informatie over het configureren van de extensie om aangepaste componenten te linten
Ondersteuning Toegankelijkheidsregels
Voor meer informatie over de regels die de plugin gebruikt om toegankelijkheidsfouten te vinden, zie Toegankelijkheidsregels.
Installeren in Beperkte Omgevingen
In de meeste gevallen kun je de Axe Toegankelijkheidslinter direct installeren vanuit de VS Code Marketplace. Echter, sommige organisaties hebben beveiligingsrestricties die het installatieproces op twee manieren beïnvloeden:
- Je kunt niet downloaden van de VS Code Marketplace.
- De extensie kan tijdens het eerste gebruik zijn vereiste binaire component, het component dat het linten van je bestanden doet en specifiek is voor het besturingssysteem, niet downloaden.
Als je organisatie deze beperkingen heeft, heb je een Axe DevTools Linter-licentie nodig om toegang te krijgen tot Deque's Agora-software repository. Je kunt dan een .vsix pakket voor de extensie downloaden.
Heb je hulp nodig met je Agora-account?
- Neem contact op met je Deque-vertegenwoordiger
- Bezoek de ondersteuningsdesk
- Email helpdesk@deque.com
Over de Installatiepakketten op Agora
Deque biedt twee pakketopties aan in de Agora-softwarerepository:
| Extensienaam | Locatie op Agora | Beschrijving |
|---|---|---|
vscode-axe-linter-<version>.vsix |
https://agora.dequecloud.com/ui/native/linter-bin/vscode-linter/ | Alleen de standaardextensie (identiek aan de versie op VS Code Marketplace), die bij de eerste keer opstarten het binaire component voor je besturingssysteem moet downloaden |
vscode-axe-linter-bundle-<version>.vsix |
https://agora.dequecloud.com/ui/native/linter-bin/vscode-linter-bundle/ | Een compleet pakket dat zowel de extensie als de binaire componenten voor alle besturingssystemen bevat |
Je zult een mapweergave zien van alle versies van de extensie, bijvoorbeeld:
Je kiest meestal de nieuwste versie en navigeert door de subdirectories totdat je het .vsix bestand vindt.
Installatiestappen
- Download je gewenste
.vsixpakket uit de Deque Agora repository. - Open in VS Code het Extensies paneel.
- Klik op het overloopmenu (...).
- Selecteer Installeren vanuit VSIX..., de laatste optie in het menu.
- Kies je gedownloade
.vsixbestand.
Probleemoplossing
De VS Code-extensie schrijft diagnostische informatie naar een Axe Linter uitvoerkanaal. Dit logboek legt de opstartactiviteit van de extensie vast, inclusief platformdetails, extensieversie en de status van de binaire componentdownload, en is vooral nuttig voor het diagnosticeren van problemen wanneer de extensie niet correct start of initialiseert.
Om het logboek te bekijken:
- Open het Uitvoer paneel (Bekijken > Uitvoer).
- Selecteer Axe Linter in het kanaaldropdownmenu in de rechterbovenhoek van het paneel.
Als je contact opneemt met Deque-ondersteuning over een probleem met de extensie, kan het toevoegen van de inhoud van dit logboek het team helpen het probleem te diagnosticeren.
Volgende stappen
Deze documentatiesite bevat informatie over het gebruik van de verschillende Axe DevTools Linter-aanbiedingen. Voor meer informatie, zie Over Axe DevTools Linter.