User Documentation
Baixar
Iniciar

Extras para o Visual Studio Code

Introdução

Visual Studio Code é um editor de código-fonte desenvolvido pela Microsoft para Windows, Linux e macOS (incluindo Macs M1). Ele inclui suporte para depuração, controle Git embutido e GitHub, destaque de sintaxe, conclusão inteligente de código, trechos de código (snippets) e refatoração de código.

A principal característica do editor é que ele é extensível e possui uma enorme coleção de extensões mantidas pelos usuários e pela própria Microsoft.

Como introdução geral, esta é uma apresentação sobre o tópico Joomla Development with Visual Studio Code (PDF, 1Mb), por René Kreijveld, desenvolvedor Joomla da Destiny B.V. Joomla User Group London, 16 de março de 2021.

Nesta página, detalhamos uma lista de extensões recomendadas para configurar o VSCode para suportar PHP e Joomla!.

Esta é uma lista de extensões para suportar PHP no VSCode:

O protocolo Git é suportado nativamente no VSCode. No entanto, existem extensões para melhorar o gerenciamento de código e repositórios. Esta é uma lista de extensões em destaque para essa tarefa:

Esta é uma lista de extensões para dar suporte ao Joomla no VSCode:

Esta é uma lista de extensões para dar suporte ao desenvolvimento remoto via SSH:

  • Remote - SSH ms-vscode-remote.remote-ssh: A extensão Remote - SSH permite usar qualquer máquina remota com um servidor SSH como seu ambiente de desenvolvimento. Isso pode simplificar bastante o desenvolvimento e a solução de problemas em diversas situações. Para mais informações: Desenvolvimento remoto via SSH
  • Live Share MS-vsliveshare.vsliveshare: O Visual Studio Live Share permite editar e depurar colaborativamente com outras pessoas em tempo real, independentemente das linguagens de programação que você está usando ou dos tipos de aplicativos que está criando. Ele permite compartilhar instantaneamente (e com segurança) seu projeto atual e, conforme necessário, compartilhar sessões de depuração, instâncias de terminal, aplicativos web em localhost, chamadas de voz e muito mais!

Esta é uma lista de extensões úteis altamente recomendadas para facilitar o desenvolvimento:

  • EditorConfig for VS Code editorconfig.editorconfig Suporte ao EditorConfig para o Visual Studio Code
  • change-case wmaurer.change-case: Altere rapidamente a formatação (camelCase, CONSTANT_CASE, snake_case, etc) da seleção atual ou da palavra atual
  • Project Manager alefragnani.project-manager: Ajuda você a acessar facilmente seus projetos, não importa onde estejam localizados. Não perca mais aqueles projetos importantes.

Configuração do PHP Debug

A extensão oferece suporte às configurações mais comuns do PHP XDebug. Ela integra totalmente todos os recursos do VSCode para depurar scripts PHP.

Para configurar a extensão, visite a documentação oficial

Como exemplo de configuração para depuração no VSCode, este é um launch.json comum:

{
    // 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
        }
    ]
}

Relacionado à configuração do launch.json que o felixfbecker/vscode-php-debug requer, há a configuração do próprio PHP XDebug.

Neste momento, seu ambiente de desenvolvimento pode ter xdebug-2 ou xdebug-3. Eles diferem nos parâmetros necessários. Para configurar o PHP XDebug, estas são as configurações mais comuns para o php.ini.

Configuração do XDebug 2

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

Configuração do XDebug 3

[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

Para saber mais sobre como o XDebug funciona internamente para se conectar ao editor, consulte a [documentação](Xdebug 3 — Documentation).

Configuração do phpcs

Para configurar a extensão, visite a documentação oficial. A extensão oferece suporte às configurações mais comuns do PHP_CodeSniffer.

Por padrão, o PHP_CodeSniffer vem com diversos padrões de codificação. Uma vez instalada a extensão, ela funciona com PSR2.

    "phpcs.standard": "PSR2",

Para configurar a extensão para aplicar os Joomla! Coding Standards, instale as regras seguindo o guia oficial. Uma vez instalado o Joomla! Coding Standards, configure as Configurações do usuário seguindo este exemplo de configuração:

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

Configuração do PHP Intelephense

Para configurar a extensão, visite a documentação do intelephense. A extensão não requer configuração adicional.

O VSCode vem com suporte básico à linguagem PHP. Portanto, é provavelmente uma boa ideia desativar o suporte padrão para evitar conflitos:

    // Desativar sugestões básicas
    "php.suggest.basic": false,

    // Para ativar as sugestões de código em comentários
    "editor.quickSuggestions": { "comments": true },

Como alternativa, também há uma extensão muito popular: PHP IntelliSense felixfbecker.php-intellisense, com suporte avançado a autocompletar e refatoração para PHP.

Configuração do PHPUnit

Para configurar a extensão, visite a documentação do vscode phpunit

A extensão integra o PHP Unit com o VSCode, de modo que todos os recursos do PHP Unit sejam integrados ao VSCode e também possam ser parametrizados para uma integração mais avançada com a interface do usuário.

Este é um exemplo de configuração da extensão:

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

Configuração do php cs fixer (Somente para PSR2)

Para configurar a extensão, visite a documentação do vscode php cs fixer. A extensão integra o PHP-CS-Fixer com o VSCode, de modo que todos os recursos do PHP-CS-Fixer sejam integrados ao VSCode e também possam ser parametrizados para uma integração mais avançada com a interface do usuário.

Para aplicar automaticamente o PHP-CS-Fixer aos arquivos PHP, configure as configurações do usuário desta forma:

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

Configuração do PHP Phan (Analyzer)

Para configurar a extensão, visite a documentação oficial. Este é um exemplo de configuração da extensão:

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

Configuração do phpmd

Para configurar a extensão, visite a documentação oficial. A extensão não requer configuração adicional.

Este é um exemplo de configuração da extensão:

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

Configurar o EditorConfig for VS Code

EditorConfig é um formato de arquivo e uma coleção de plugins de editor de texto para manter estilos de codificação consistentes entre diferentes editores e IDEs.

Para configurar o editor de acordo com suas preferências, crie um arquivo .editorconfig:

; EditorConfig ajuda os desenvolvedores a definir e manter estilos
; de codificação consistentes entre diferentes editores e IDEs.

; Para mais informações, visite http://editorconfig.org.
root = true

; Escolha entre lf ou rf na propriedade "end_of_line"
[*]
charset = utf-8
end_of_line = lf
indent_size = 2
indent_style = space
insert_final_newline = true
trim_trailing_whitespace = true

# editorconfig-tools não consegue ignorar strings longas ou 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