User Documentation
Downloaden
Start

Visual Studio Code extra's

Introductie

Visual Studio Code is een broncode tekstverwerker ontwikkeld door Microsoft voor Windows, Linux en macOS (inclusief M1 Macs). Het bevat ondersteuning voor debuggen, ingebouwde Git-besturing en GitHub, syntax highlighting, intelligente code-aanvulling, snippets en code refactoring.

Het belangrijkste kenmerk van de tekstverwerker is dat deze uitbreidbaar is en een enorme collectie extensies heeft die worden onderhouden door gebruikers en door Microsoft zelf.

Als algemene introductie is hier een presentatie over het onderwerp Joomla Development with Visual Studio Code (PDF, 1Mb), door René Kreijveld, Joomla ontwikkelaar Destiny B.V. Joomla User Group London, 16 maart 2021.

Op deze pagina geven we een lijst van aanbevolen extensies om VSCode te configureren voor ondersteuning van PHP en Joomla.

Dit is een lijst van extensies ter ondersteuning van PHP op VSCode:

Het Git-protocol wordt native ondersteund in VSCode. Er zijn echter extensies om codebeheer en repositorybeheer te verbeteren. Dit is een lijst van speciale extensies voor deze taak:

Dit is een lijst met extensies ter ondersteuning van Joomla in VSCode:

Dit is een lijst met extensies ter ondersteuning van remote SSH ontwikkeling:

  • Remote - SSH ms-vscode-remote.remote-ssh: Met de Remote - SSH extensie kunt u elke externe machine met een SSH server gebruiken als uw ontwikkelomgeving. Dit kan de ontwikkeling en het oplossen van problemen in veel situaties sterk vereenvoudigen. Voor meer informatie: Remote development over SSH
  • Live Share MS-vsliveshare.vsliveshare: Met Visual Studio Live Share kunt u in real-time samen met anderen bewerken en debuggen, ongeacht welke programmeertalen u gebruikt of welk type apps u bouwt. Het stelt u in staat om direct (en veilig) uw huidige project te delen, en vervolgens, indien nodig, debug-sessies, terminal-instanties, localhost webapps, spraakoproepen en meer te delen!

Dit is een lijst met handige extensies die sterk worden aanbevolen om de ontwikkeling te vergemakkelijken:

  • EditorConfig for VS Code editorconfig.editorconfig EditorConfig ondersteuning voor Visual Studio Code
  • change-case wmaurer.change-case: Wijzig snel de case (camelCase, CONSTANT_CASE, snake_case, etc.) van de huidige selectie of het huidige woord
  • Project Manager alefragnani.project-manager: Dit helpt u om eenvoudig toegang te krijgen tot uw projecten, waar ze zich ook bevinden. Mis die belangrijke projecten niet meer.

PHP Debug Configuratie

De extensie ondersteunt de meest voorkomende configuraties van PHP XDebug. Het integreert alle VSCode functies volledig om PHP scripts te debuggen.

Bezoek de officiële documentatie om de extensie te configureren

Als voorbeeldconfiguratie voor VSCode debugging, dit is een gebruikelijke launch.json:

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [

        {
            "name": "Listen for XDebug",
            "type": "php",
            "request": "launch",

            // Server Remote XDebug Port - 9000 is the default XDebug port
            "port": 9000,

            // Server Remote Path -> Local Project Path
            "pathMappings": {
                "/app/www": "${workspaceRoot}/www"
            }
        },
        {
            "name": "Launch currently open script",
            "type": "php",
            "request": "launch",
            "program": "${file}",
            "cwd": "${fileDirname}",

            // Local XDebug Port - 9000 is the default XDebug port
            "port": 9000
        }
    ]
}

Met betrekking tot de launch.json configuratie die felixfbecker/vscode-php-debug vereist, is dit de configuratie van PHP XDebug zelf.

Op dit moment zou uw ontwikkelomgeving xdebug-2 of xdebug-3 kunnen hebben. Ze verschillen in de vereiste parameters. Om PHP XDebug te configureren, zijn dit de meest voorkomende instellingen voor php.ini.

XDebug 2 configuratie

[XDebug]
;;;;;;;;;;;;;;;;;;;
; xdebug-2.9.8
;;;;;;;;;;;;;;;;;;;
xdebug.remote_enable = 1
xdebug.remote_autostart = 1
; xdebug.remote_port = 9000

XDebug 3 configuratie

[XDebug]
;;;;;;;;;;;;;;;;;;;
; xdebug-3.0.0
; https://xdebug.org/docs/upgrade_guide
;;;;;;;;;;;;;;;;;;;
xdebug.mode = debug
xdebug.start_with_request = yes
xdebug.discover_client_host = true
; xdebug.client_port = 9000

Om meer te weten te komen over hoe XDebug intern werkt om verbinding te maken met de tekstverwerker, raadpleeg de [documentatie](Xdebug 3 — Documentation).

phpcs Configuratie

Bezoek de officiële documentatie om de extensie te configureren. De extensie ondersteunt de meest voorkomende configuraties van PHP_CodeSniffer.

Standaard wordt PHP_CodeSniffer geleverd met verschillende codeerstandaarden. Zodra de extensie is geïnstalleerd, werkt het met PSR2.

    "phpcs.standard": "PSR2",

Om de extensie te configureren om de Joomla! Coding Standards toe te passen, installeer de regels volgens de officiële handleiding. Zodra de Joomla! Coding Standards is geïnstalleerd, configureer de Gebruikersinstellingen volgens dit voorbeeld:

    "phpcs.standard": "/home/YOUR-USER/.../Joomla",

Configuratie van PHP Intelephense

Bezoek de intelephense documentatie om de extensie te configureren. De extensie vereist geen aanvullende configuratie.

VSCode wordt geleverd met basisondersteuning voor de PHP taal. Het is daarom waarschijnlijk een goed idee om de standaardondersteuning uit te schakelen om conflicten te voorkomen:

    // Disable basic suggestions
    "php.suggest.basic": false,

    // To activate code suggestions in comments
    "editor.quickSuggestions": { "comments": true },

Als alternatief is er ook een zeer populaire extensie: PHP IntelliSense felixfbecker.php-intellisense Geavanceerde autocompletie en refactoring ondersteuning voor PHP.

PHPUnit Configuratie

Om de extensie te configureren, bezoek de vscode phpunit documentatie

De extensie integreert PHP Unit met VSCode, zodat alle functies van PHP Unit geïntegreerd zijn met VSCode en ook geparametriseerd kunnen worden voor verdere integratie met de gebruikersinterface.

Dit is een voorbeeldconfiguratie van de extensie:

    "phpunit.preferRunClassTestOverQuickPickWindow": true,
    "phpunit.driverPriority": [
        "Path",
        "Command",
        "Composer",
        "Phar",
        "Ssh",
        "GlobalPhpUnit"
    ],

php cs fixer Configuratie (Alleen voor PSR2)

Om de extensie te configureren, bezoek de vscode php cs fixer documentatie. De extensie integreert PHP-CS-Fixer met VSCode, zodat alle functies van PHP-CS-Fixer geïntegreerd zijn met VSCode en ook geparametriseerd kunnen worden voor verdere integratie met de gebruikersinterface.

Om PHP-CS-Fixer automatisch toe te passen op PHP-bestanden, configureer de gebruikersinstellingen op deze manier:

    "[php]": {
        "editor.defaultFormatter": "junstyle.php-cs-fixer",
    },
    "php-cs-fixer.onsave": true,

PHP Phan (Analyzer) Configuratie

Om de extensie te configureren, bezoek de officiële documentatie. Dit is een voorbeeldconfiguratie van de extensie:

    "phan.phpExecutablePath": "/usr/bin/php",
    "phan.analyzedFileExtensions": [
        "php"
    ],

phpmd Configuratie

Om de extensie te configureren, bezoek de officiële documentatie. De extensie vereist geen aanvullende configuratie.

Dit is een voorbeeldconfiguratie van de extensie:

    "phpmd.command": "php /home/YOUR-USER/.../phpmd/phpmd.phar",
    "phpmd.rules": "/home/YOUR-USER/.../phpmd-rulesets/phpmd_config.xml",

EditorConfig configureren voor VS Code

EditorConfig is een bestandsformaat en verzameling van tekstverwerker plugins voor het behouden van consistente codeerstijlen tussen verschillende tekstverwerkers en IDE's.

Om de tekstverwerker naar wens in te stellen, maak een bestand .editorconfig aan:

; EditorConfig helps developers define and maintain consistent
; coding styles between different editors and IDEs.

; For more visit http://editorconfig.org.
root = true

; Choose between lf or rf on "end_of_line" property
[*]
charset = utf-8
end_of_line = lf
indent_size = 2
indent_style = space
insert_final_newline = true
trim_trailing_whitespace = true

# editorconfig-tools is unable to ignore longs strings or urls
max_line_length = null

[*.html]
indent_style = tab

# PSR-2
# [*.php]
# indent_size = 4
# indent_style = space

# Joomla! Coding Standards
[*.php]
indent_size = 4
indent_style = tab

[*.md]
trim_trailing_whitespace = false

[*.yml]
indent_style = space
indent_size = 2