Visual Studio Code : configurer PHP-CS-Fixer

Logo Visual Studio Code

Il y a peu, j'ai réinstallé mon poste de travail. Gros boulet que je suis, j'ai oublié de conserver une copie des fichiers de configuration de l'extension php cs fixer de Visual Studio Code. Je profite donc de refaire la configuration pour rédiger ce petit billet qui me servira de mémo à l'avenir. Et qui sait, peut-être que ces quelques lignes pourront être utiles à certains d'entre vous. :P

 

PHP CS Fixer ?

PHP CS Fixer (PHP Coding Standards Fixer) vous permet de formater votre code automatiquement selon les standards de programmation (PSR-1, PSR-2, etc.) voire d'appliquer des directives spécifiques à vos développements.

 

Installation de l'extension

Ajouter l'extension php cs fixer de junstyle à Visual Studio Code.

 

Téléchargement de php-cs-fixer-v2.phar

Pour que cette extension fonctionne, il faut "installer" Php CS Fixer. Pour ce faire, télécharger le fichier php-cs-fixer-v2.phar sur gitHub : https://github.com/FriendsOfPHP/PHP-CS-Fixer#installation

Placez ce fichier dans votre répertoire php. Pour ma part, mon répertoire se trouve à la racine : c:/php/

 

Le fichier de configuration

Il faut maintenant créer un fichier explicitant vos règles de formatage des fichiers. Personnellement, je l'ai nommé vscode.php_cs et configuré comme suit :

return PhpCsFixer\Config::create() ->setRules([
    '@PSR2' => true,
    'array_syntax' => ['syntax' => 'short'],
    'combine_consecutive_unsets' => true,
    'method_separation' => true,
    'no_multiline_whitespace_before_semicolons' => true,
    'single_quote' => true,
    'binary_operator_spaces' => [
        'align_double_arrow' => true,
        'align_equals' => false
    ],
    'blank_line_after_opening_tag' => true,
    'blank_line_before_return' => true,
    'braces' => [
        'allow_single_line_closure' => true
    ],
    'concat_space' => ['spacing' => 'one'],
    'declare_equal_normalize' => true,
    'function_typehint_space' => true,
    'hash_to_slash_comment' => true,
    'include' => true,
    'lowercase_cast' => true,
    'no_extra_consecutive_blank_lines' => [
        'curly_brace_block',
        'extra',
        'parenthesis_brace_block',
        'square_brace_block',
        'throw',
        'use',
    ],
    'no_multiline_whitespace_around_double_arrow' => true,
    'nospaces_around_offset' => true,
    'no_whitespace_before_comma_in_array' => true,
    'no_whitespace_in_blank_line' => true,
    'object_operator_without_whitespace' => true,
    'single_blank_line_before_namespace' => true,
    'ternary_operator_spaces' => true,
    'trim_array_spaces' => true,
    'unary_operator_spaces' => true,
    'whitespace_after_comma_in_array' => true,
])
->setLineEnding("\r\n")
->setUsingCache(false);

Je ne vous détaille pas les règles car elles sont relativement explicites. :) Vous trouverez leurs détails ici : https://github.com/FriendsOfPHP/PHP-CS-Fixer

Personnellement, j'ai placé ce fichier dans le répertoire de php : c:/php/

 

Configuration de Visual Studio Code

Enfin, indiquez les chemins (path) de vos deux fichiers php-cs-fixer-v2.phar et vscode.php_cs dans les paramètres de Visual Studio Code :

"php-cs-fixer.executablePath": "C:\\php\\php-cs-fixer-v2.phar",
"php-cs-fixer.config": "C:\\php\\vscode.php_cs",

Pour formater votre code, il vous suffit maintenant de presser les touches Alt + Maj + F (raccourcis par défaut sous Windows).

 

Et le tour est joué ! ^^

Solus et Lenovo IdeaPad Yoga 13 : driver wifi RTL8723AU

Logo Solus Project

Aujourd'hui, j'ai installé la distribution Solus sur mon ordinateur portable : Lenovo IdeaPad Yoga 13. Je lorgne sur cette distribution depuis quelques temps et j'ai donc décidé de sauter le pas en l'installant en dual-boot.

Au premier démarrage, je me suis rendu compte que ma carte wifi Realtek RTL8723AU n'était pas reconnue par le système, ce qui, vous en conviendrez, est relativement gênant pour un usage nomade.

Bref, il m'a donc fallu installer le driver de la carte Wifi à la main.

Je vous partage ici la méthode pour en garder une trace... au cas où. ^^

 

Prérequis

Avant tout chose, ouvrez votre Terminal.

Il faut tout d'abord installer les paquets nécessaires à l'opération :

sudo eopkg it -c system.devel
sudo eopkg it linux-current-headers git

 

Téléchargement des sources

Dans votre répertoire /home/votre-username/, clonez le dépôt suivant :

git clone https://github.com/lwfinger/rtl8723au.git

 

C'est parti

Enfin, lancez les commandes suivantes (l'une après l'autre bien entendu) :

cd rtl8723au
make
sudo make install
sudo modprobe 8723au

 

N.B. : Lors de la compilation, la commande make m'a renvoyé 2 ou 3 Warning. Dans mon cas, cela n'a pas eu d'incidence sur le déroulement de l'opération.

 

Et le tour est joué :)

 

Sources : https://github.com/lwfinger/rtl8723au

 

Intégrer Cmder à Visual Studio Code

Aujourd'hui, petit mémo rapide. :)

J'utilise Visual Studio Code depuis presque un an. Cet IDE est vraiment très agréable à utiliser mais malgré tout, je trouve les terminaux intégrés (powershell ou cmd) très inesthétiques et peu pratiques :

Visual Studio Code terminal intégré (cmd)

 

En parallèle, j'utilise un émulateur de terminal que j'apprécie beaucoup : Cmder. Alors pourquoi ne pas associer les deux ? ^^

Si vous souhaitez intégrer Cmder.exe à Visual Studio Code :

  1. Créer un fichier vscode.bat à la racine du répertoire cmder. Dans cet exemple : C:/cmder

     

  2. Ajoutez ces quelques lignes :
    @echo off
    SET CurrentWorkingDirectory=%CD%
    SET CMDER_ROOT=C:\cmder
    CALL "%CMDER_ROOT%\vendor\init.bat"
    CD /D %CurrentWorkingDirectory%

     

  3. Dans les paramètres de Visual Studio Code, ajoutez ces deux lignes :
    "terminal.integrated.shell.windows": "C:\\WINDOWS\\system32\\cmd.exe",
    "terminal.integrated.shellArgs.windows": ["/K", "C:\\cmder\\vscode.bat"]

 

Et voilà le résultat :

Visual Studio Code avec cmder intégré

 

Non seulement l'interface de Cmder est plus esthétique, mais en plus, elle intègre tous les outils qui me sont nécessaires (bash, git, etc.). Bonus : on visualise directement la branche Git sur laquelle on travaille ! Bref, que du bonheur. ^^

Sources :
https://github.com/Microsoft/vscode/issues/12006
https://code.visualstudio.com/docs/editor/integrated-terminal

Visual Studio Code : debugger / déboguer une extension ?

Logo Visual Studio Code

 

Il y a peu de temps, j'ai mis à jour mon stack de programmation : Wampserver / Node / php-cs-fixer / etc.

Malheureusement, cela ne fut pas sans conséquence : je me suis rapidement rendu compte qu'une extension ne fonctionnait plus correctement dans Visual Studio Code : php cs fixer. J'avais pourtant fait attention à bien remettre en place tous les fichiers de config de php cs fixer lors de ma mise à jour.

J'ai mis quelques heures à trouver la cause du problème donc je vous partage ici une méthode pour deboguer une extension.

Première chose à faire, activez les outils de développement :

Menu Visual Studio Code, rubrique Aide

 

Rendez vous ensuite sur l'onglet "Console". Une fois la console de déboguage ouverte, lancez la commande exécutant votre extension, cela vous permettra d'identifier la source du problème.

Pour ma part, j'ai appliqué le raccourci clavier exécutant la commande php-cs-fixer.phar (Alt + Maj + F). Le résultat ne s'est pas fait attendre :

ERR Bad argument : TypeError: Bad argument
    at ChildProcess.spawn (internal/child_process.js:294:26)
    at Object.exports.spawn (child_process.js:390:9)
    at PHPCSFixer.format (...)


L'erreur est beaucoup plus longue mais ça n'a pas d'intérêt de vous l'afficher en entier. Bad argument ? php-cs-fixer.phar étant lancé par la commande php.exe, je me suis rendu dans les paramètres de Visual Studio Code pour vérifier que tout était d'équerre du côté définition de php. J'ai rapidement identifié qu'il me manquait un paramètre, et pas des moindres : le chemin vers php.exe !

J'ai donc simplement ajouté :

"php.validate.executablePath": "C:\\path\\to\\php_version\\php.exe",

 

Et le tour est joué ! Pourquoi ce paramètre avait disparu suite à la mise à jour de mon stack ? Je ne saurais le dire. :(

Quoiqu'il en soit, si vous avez un problème avec Visual Studio Code, pensez à activer les outils de développement. :)

How-to : installer le thème newFlat (PluXml 5.6)

Suite à la demande d'un lecteur , voici un petit tuto sur la mise en place du thème qui habille actuellement ce blog : newFlat.

 

Thème newFlat

 

Comme vous allez le constater, je n'ai jamais pris le temps de peaufiner le thème. Sa mise en place est donc quelque peu artisanale. :P

L'unique prérequis avant de vous lancer dans ce tuto est de disposer d'un PluXml prêt à l'emploi. :)

 

Lire la suite de How-to : installer le thème newFlat (PluXml 5.6)