Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision
Révision précédente
visual_studio_code [Le 11/11/2023, 12:12]
2.14.209.128 [Extension VSCodium Five Server - fichiers HTML et PHP]
visual_studio_code [Le 12/05/2025, 12:27] (Version actuelle)
krodelabestiole [Désinstallation] (est-ce bien nécessaire ?)
Ligne 6: Ligne 6:
 [[wpfr>​Visual Studio Code]] (ou //VSCode//) est un logiciel de développement créé par Microsoft. Il est compatible avec linux, et est publié sous double licence, libre ou propriétaire. La version Microsoft est sous licence propriétaire,​ avec quelques [[https://​vscodium.com/#​why|adjonctions]],​ comme de la télémétrie ou un logo MS. [[wpfr>​Visual Studio Code]] (ou //VSCode//) est un logiciel de développement créé par Microsoft. Il est compatible avec linux, et est publié sous double licence, libre ou propriétaire. La version Microsoft est sous licence propriétaire,​ avec quelques [[https://​vscodium.com/#​why|adjonctions]],​ comme de la télémétrie ou un logo MS.
  
-La version libre, quasi similaire mais sans [[https://​vscodium.com/#​why|les ajouts de Microsoft]],​ s'​appelle [[https://​vscodium.com/​|VSCodium]].+La version libre, quasi similaire mais sans les [[https://​vscodium.com/#​why|ajouts ​propriétaires et intrusifs ​de Microsoft]],​ s'​appelle ​**[[https://​vscodium.com/​|VSCodium]]**(([[https://​github.com/​VSCodium/​vscodium.github.io|GitHub]])).
  
-La page ci-dessous ​vous explique comment installer l'une ou l'​autre ​version, à votre convenance.+Cette page vous laisse le choix entre la version ​Microsoft **[[#​Installation VSCode|VSCode]]** et la version communautaire **[[#​Installation VSCodium|VSCodium]]**, à votre convenance ​:
  
-<​note>​Par défaut, VSCodium ne permet pas d'​accéder au dépôt d'​extensions Visual Studio Marketplace,​ maintenu par Microsoft.+===== Installation VSCode =====
  
-Il est cependant possible de [[https://​github.com/​VSCodium/​vscodium/​blob/​master/​DOCS.md#​extensions-marketplace|modifier le fichier product.json]] pour y avoir accès.</​note>​+Il existe plusieurs manière d'​installer **VSCode** sur Ubuntu ​:
  
-===== Installation =====+==== Via snap ====
  
-Cette page vous laisse le choix entre la version Microsoft et VSCodium.+L'​installation via [[snap|snap]] est la plus simple : 
 +**VSCode** est disponible en [[:snap]] depuis [[https://​snapcraft.io/​code|Snapcraft]].
  
 +On peut donc simplement installer ''​code''​ depuis le [[:snap store|centre d'​applications (Snap Store)]], ou installer le paquet ''​code''​ en ligne de commande :
 +<​code>​snap install code --classic</​code>​
  
-[[https://​code.visualstudio.com/​download|Allez sur cette page]], et sélectionnez ​le fichier "deb (Debian, Ubuntu)"​ en 64 ou 32 bits [[ubuntu_64bits#​les_processeurs_compatibles|selon votre ordinateur]]. +==== Via le PPA de Microsoft ​(déconseillé====
-Installez le à l'​aide ​de l'​interface graphique ​(tel que gdebi-gtkou en ligne de commande <​code>​ +
-sudo dpkg -i code_*.deb</​code>​+
  
-et vous pourrez exécuter Visual Studio Code avec la commande <​code>​code</​code>​ +La clé PGP et le [[:PPA]] peuvent être ajoutés comme suit :
- +
-=== Via PPA de Microsoft === +
- +
-La clé PGP et le PPA peuvent être ajoutés comme suit :+
  
 <code bash> <code bash>
Ligne 34: Ligne 31:
 sudo sh -c 'echo "deb [arch=amd64 signed-by=/​usr/​share/​keyrings/​packages.microsoft.gpg] https://​packages.microsoft.com/​repos/​vscode stable main" > /​etc/​apt/​sources.list.d/​vscode.list'​ sudo sh -c 'echo "deb [arch=amd64 signed-by=/​usr/​share/​keyrings/​packages.microsoft.gpg] https://​packages.microsoft.com/​repos/​vscode stable main" > /​etc/​apt/​sources.list.d/​vscode.list'​
 </​code>​ </​code>​
-Puis mettez à jour la liste des paquets et installez ​vscode ​:+Puis mettez à jour la liste des paquets et installez ​**VSCode** ​:
 <code bash> <code bash>
 sudo apt install apt-transport-https sudo apt install apt-transport-https
Ligne 41: Ligne 38:
 </​code>​ </​code>​
  
-=== Via snap ===+==== Paquet deb isolé (déconseillé) ====
  
-L'​installation via [[snap|snap]] est la plus simple: +<note
-<code+Cette méthode n'est pas recommandée parce qu'​elle ne permet pas les mises à jour automatiques. 
-sudo snap install code --classic +</note>
-</code>+
  
 +Allez sur [[https://​code.visualstudio.com/​download|cette page]], et sélectionnez le fichier //.deb (Debian, Ubuntu)// en //x64// (à moins que vous utilisiez un processeur différent).
 +Installez-le à l'aide de l'​interface graphique (tel que [[:​gdebi|gdebi-gtk]]) ou en ligne de commande <​code>​sudo dpkg -i code_*.deb</​code>​
  
-==== Installation ​(VSCodium====+===== Installation VSCodium ​=====
  
-Comme indiqué plus haut VSCodium est la version libre de la version Microsoft ​de Visual Studio Code. Pour l'​installer plutôt que la version Microsoft, il y a plusieurs solutions :+Comme indiqué plus haut **[[https://​vscodium.com/​|VSCodium]]**(([[https://​github.com/​VSCodium/​vscodium.github.io|GitHub]])) ​est la version ​communautaire, ​libre et débarrassée des fonctionnalités ​de //​tracking// ​de **Visual Studio Code**.
  
-Le plus simple est d'installer la version [[snap|snap]] des dépôts Ubuntu (il n'y a pas de paquet ​.deb) : +<​note>​ 
-<​code>​ +Par défaut, **VSCodium** ne permet pas d'accéder au dépôt d'extensions **Visual Studio Marketplace**,​ maintenu par Microsoft.
-sudo snap install codium +
-</​code>​+
  
-Vous pouvez ​aussi l'​installer ​directement à partir ​de dépôt du projet ​codium :+Il est cependant possible de [[https://​github.com/​VSCodium/​vscodium/​blob/​master/​DOCS.md#​extensions-marketplace|modifier le fichier product.json]] pour y avoir accès. 
 +</​note>​ 
 + 
 +Pour installer cette version, il y a plusieurs solutions : 
 +  * **VSCodium** est distribué par ses développeurs dans les versions les plus récentes sur tous les systèmes Linux en [[#​Flatpak]]. 
 +  * Ils fournissent ​aussi un paquet [[#snap]] officiel. 
 +  * Il existe aussi un [[#dépôt APT]] pour une version [[:deb]]. 
 +  * Il est aussi disponible en [[#​Appimage]] sur [[https://​github.com/​VSCodium/​vscodium/​releases|GitHub]]. 
 + 
 +==== Flatpak ==== 
 + 
 +Le dernière version de **VSCodium** est proposée par ses développeurs en [[:​Flatpak]] sur le dépôt [[https://​flathub.org/​apps/​com.vscodium.codium|Flathub]]. 
 + 
 +On peut donc l'​obtenir en [[:​tutoriel:​installer_application_flatpak|installant Flatpak]] avec le [[:​flatpak#​ajout_du_depot_flathub|dépôt Flathub]] si ce n'est pas déjà fait, puis en installant ''​VSCodium''​ depuis [[:​gnome-software|GNOME Logiciels]],​ ou en installant le paquet ''​com.vscodium.codium''​ en ligne de commande : 
 +<​code>​flatpak install com.vscodium.codium</​code>​ 
 + 
 +==== Snap ==== 
 + 
 +**VSCodium** est disponible en [[:snap]] depuis [[https://​snapcraft.io/​codium|Snapcraft]]. 
 + 
 +On peut donc l'​installer ​sur Ubuntu simplement en installant ''​codium''​ depuis le [[:snap store|centre d'​applications (Snap Store)]], ou en installant le paquet ''​codium''​ en ligne de commande : 
 +<​code>​snap install ​codium</​code>​ 
 + 
 +==== Appimage ==== 
 + 
 +<​note>​ 
 +Cette méthode n'est pas recommandée parce qu'​elle ne permet //a priori// pas les mises à jour automatiques. 
 +</​note>​ 
 + 
 +Pour installer une **[[:​Appimage]]** référez-vous avant tout au [[:​appimage#​installer_un_appimage|chapitre dédié]] au sujet. 
 + 
 +En résumé téléchargez le fichier correspondant à votre version d'​Ubuntu sur [[https://​github.com/​VSCodium/​vscodium/​releases|GitHub]],​ puis [[:​permissions#​modifier_les_permissions|rendez-le exécutable]] (clic droit sur le fichier -> //​Propriétés//​ -> //​Permissions//​ -> //Autoriser l’exécution//​). Finalement lancez-le en double-cliquant dessus.\\  
 +Vous pouvez utiliser un service tel que **[[:​appimage#​go_appimageappimaged|appimaged]]** pour créer automatiquement un [[:​raccourci-lanceur|lanceur]]. 
 + 
 +==== Dépôt APT ==== 
 + 
 +Paul Carroty fournit un [[:​PPA|dépôt APT]] pour **VSCodium** sur Ubuntu et Debian. 
 + 
 +La marche à suivre pour l'​installer est expliquée en anglais sur [[https://​gitlab.com/​paulcarroty/​vscodium-deb-rpm-repo#​how-to-install-for-debianubuntulinux-mint|cette page]].
  
 <code bash> <code bash>
Ligne 70: Ligne 104:
  
 # Installation de VSCodium # Installation de VSCodium
- 
 sudo apt install codium sudo apt install codium
 </​code>​ </​code>​
  
-Vous pouvez désormais démarrer VSCodium en utilisant la commande <​code>​codium</​code>​ +===== Utilisation =====
-Si vous souhaiter utiliser la commande "​code"​ pour le lancer vous pouvez ajouter un lien symbolique : +
-<​code>​ +
-sudo ln -s /​usr/​bin/​codium /​usr/​bin/​code +
-</​code>​+
  
-Vous pouvez ​désormais ​démarrer ​VSCodium ​avec les commandes "code" ​ou "codium".+Vous pouvez démarrer ​VSCode ​avec la commande ''​code'' ​ou VSCodium avec ''​codium''​ (suivi éventuellement d'un nom de fichier ou répertoire).
  
 ===== Extensions ===== ===== Extensions =====
Ligne 126: Ligne 155:
  
 ==== Déboguer avec Xdebug ​ et VSCodium (ou VSCode) ==== ==== Déboguer avec Xdebug ​ et VSCodium (ou VSCode) ====
-Xdebug permet de déboguer des fichiers php avec VSCodium ou VSCode. ​   
-Tout est expliqué dans cette vidéo((voir [[https://​www.youtube.com/​watch?​v=MmyxWy8jl7U|cette vidéo]])) ((d'​après [[https://​forum.ubuntu-fr.org/​viewtopic.php?​id=2082060|ce sujet]] sur le forum)) 
-Par contre, dans la vidéo, il ne respecte pas les droits/​propriétés des fichiers/​dossiers dans le dossier /var/www (voir le paragraphe "10.1 permissions"​ de la page [[:​apache2]] ) 
  
-==== Extension VSCodium Five Server - fichiers ​HTML et PHP ====+**Xdebug** permet de déboguer des fichiers ​[[:PHP]] avec **VSCodium** ou **VSCode**.
  
-Pour tester rapidement les fichiers [[:PHP]] sans avoir à passer par le serveur ​[[:LAMP]], on peut installer l'​extension [[https://​open-vsx.org/​extension/​yandeu/​five-server|Live Server (Five Serveur)]] sur VSCodium.((d'​après [[https://​forum.ubuntu-fr.org/​viewtopic.php?​id=2082060|ce sujet]] sur le forum))+=== Débogage depuis un serveur ​web local ===
  
-3 configurations à effectuer ​(//File// -> //​Preferences// -> //Settings//, puis on tape ''​Five Server'' ​dans la barre de recherche):+Pour un débogage depuis le serveur, tout est expliqué dans cette vidéo((voir [[https://www.youtube.com/watch?​v=MmyxWy8jl7U|cette vidéo]])) ((d'​après [[https://forum.ubuntu-fr.org/viewtopic.php?​id=2082060|ce sujet]] sur le forum)) 
 +Par contre, dans la vidéo, il ne respecte pas les droits/​propriétés des fichiers/​dossiers dans le dossier /var/www (voir le paragraphe "10.1 permissions" ​de la page [[:apache2]] ). Et cette version ne permet que déboguer depuis le serveur local.
  
 +=== Débogage sans serveur ou depuis un serveur web local - un seul fichier de configuration ===
 +
 +1 - Installer xdebug
 +
 +Installer Xdebug :
 +<​code>​sudo apt install php-xdebug</​code>​
 +Pour vérifier la bonne installation,​ la commande
 +  php -v
 +devrait mentionner ''​Xdebug''​ dans un retour du type :
 +<​code>​
 +PHP 8.3.6 (cli) (built: Dec  2 2024 12:36:18) (NTS)
 +Copyright (c) The PHP Group
 +Zend Engine v4.3.6, Copyright (c) Zend Technologies
 +    with Zend OPcache v8.3.6, Copyright (c), by Zend Technologies
 +    with Xdebug v3.2.0, Copyright (c) 2002-2022, by Derick Rethans
 +</​code>​
 +<​note>​
 +Ces informations permettent de voir si **Xdebug** est installé et de repérer la version de PHP (8.3 ci-dessus). Les lignes de commande ci-dessous seront à adapter suivant vos versions.
 +</​note>​
 +On peut utiliser deux fichiers pour la configuration de **Xdebug**. Le premier pour une session "​CLI"​ ( interface de ligne de commande - sans serveur) le deuxième pour le serveur web :
 +  * ''/​etc/​php/​8.1/​cli/​conf.d/​20-xdebug.ini''​
 +  * ''/​etc/​php/​8.1/​apache2/​conf.d/​20-xdebug.ini''​
 +
 +2 - On va effacer ces deux fichiers et créer des liens symboliques vers le fichier ou se trouvera la configuration de **Xdebug**. Un appel de ''/​etc/​php/​8.1/​cli/​conf.d/​20-xdebug.ini''​ ou de ''/​etc/​php/​8.1/​apache2/​conf.d/​20-xdebug.ini''​ nous ramènera vers le fichiers de configuration (''/​etc/​php/​8.1/​mods-available/​xdebug.ini''​). Cela permet de n'​avoir qu'un seul fichier de configuration.
 +
 +Effacer ''/​etc/​php/​8.1/​cli/​conf.d/​20-xdebug.ini''​ :
 +<​code>​sudo rm /​etc/​php/​8.1/​cli/​conf.d/​20-xdebug.ini</​code>​
 +Effacer /​etc/​php/​8.1/​apache2/​conf.d/​20-xdebug.ini:​
 +<​code>​sudo rm /​etc/​php/​8.1/​apache2/​conf.d/​20-xdebug.ini</​code>​
 +
 +3 - Créer le premier lien symbolique :
 +<​code>​sudo ln -s /​etc/​php/​8.1/​mods-available/​xdebug.ini /​etc/​php/​8.1/​cli/​conf.d/​20-xdebug.ini</​code>​
 +Puis le deuxième lien symbolique:
 +<​code>​sudo ln -s /​etc/​php/​8.1/​mods-available/​xdebug.ini /​etc/​php/​8.1/​apache2/​conf.d/​20-xdebug.ini</​code>​
 +
 +4 - Puis configurer l'​unique fichier de configuration ''/​etc/​php/​8.1/​mods-available/​xdebug.ini''​ :
 +<​code>​zend_extension=xdebug.so
 +xdebug.mode = develop, debug
 +xdebug.start_with_request = yes
 +xdebug.log = /​tmp/​xdebug.log
 +xdebug.client_host = localhost
 +xdebug.client_port = 9003</​code>​
 +
 +5 - Redémarrer apache2:
 +<​code>​sudo systemctl restart apache2</​code>​
 +
 +6 - Créer un fichier ''​phpinfo.php''​ avec ce contenu :
 +<​code><?​php
 +phpinfo();</​code>​
 +Place ce fichier dans le répertoire ''/​var/​www/​html''​ du serveur et ouvrir dans un navigateur web l'URL ''​[[http://​localhost/​phpinfo.php]]''​ correspondant au fichier.
 +
 +Vérifier la bonne installation de Xdebug :
 +<​code>​This program makes use of the Zend Scripting Language Engine:
 +Zend Engine v4.1.2, Copyright (c) Zend Technologies
 +    with Zend OPcache v8.1.2-1ubuntu2.14,​ Copyright (c), by Zend Technologies
 +    with Xdebug v3.1.2, Copyright (c) 2002-2021, by Derick Rethans</​code>​
 +Il existe un paragraphe concernant Xdebug sur cette page ou on peut créer un fichier xdebug_infos.php dans lequel il faut insérer
 +<​code><?​php ​
 +xdebug_info();</​code>​
 +On doit également placer ce fichier dans le dossier ''/​var/​www/​html''​ \\ 
 +on lance le fichier avec l'URL [[http://​localhost/​xdebug_info.php]]
 +On y retrouve les paramètres de réglage que l'on a effectué dans le fichier ''/​etc/​php/​8.1/​mods-available/​xdebug.ini''​.
 +
 +=== Comment déboguer? ===
 +
 +Xdedug fonctionne de deux manières:
 +
 +1 - avec une session CLI (sans serveur et sans fichier de configuration launch.json):​ \\
 +- Ouvrir votre fichier avec VSCode \\
 +- Mettre des points d'​arrêt \\
 +- Lancer l'​application avec l'​option "Start Debugging"​. Le de débogueur devient opérationnel \\
 +
 +2 - avec un serveur local: \\
 +- Ouvrir votre fichier avec VSCode \\
 +- Créer un fichier launch.json file (section "run and debbug"​ dans la partie gauche de l'​interface) \\
 +- Créer ​ un(des) breakpoint(s) \\
 +- Démarrer l'​application avec l'​option "Start Debugging"​.\\
 +-  Lancer l'​application avec un navigateur internet (localhost/​my-progam.php).Le débogueur démarre.
 +
 +3 - avec le serveur web interne PHP: 
 +- Lancer le serveur PHP sur le port ''​8082''​ (par exemple) en local:
 +<​code>​ php -S localhost:​8082</​code>​
 +- Créer un fichier launch.json file si besoin (section "run and debbug"​ dans la partie gauche de l'​interface) \\
 +- Démarrer l'​application avec l'​option "Start Debugging"​.\\
 +- Lancer une requête HTTP avec le logiciel POSTMAN (par exemple) ou depuis un navigateur internet pour une requête GET.\\
 +- Le débogueur devrait démarrer aussitôt. ​
 +
 +=== le fichier launch.json de symphony ===
 +
 +pour pouvoir déboguer Symfony, il faut utiliser le fichier ''​launch.json''​ suivant:
 +<​code>​
 +{
 +    "​version":​ "​0.2.0",​
 +    "​configurations":​ [
 +      {
 +        "​name":​ "​Listen for Xdebug",​
 +        "​type":​ "​php",​
 +        "​request":​ "​launch",​
 +        "​port":​ 9003,
 +        "​pathMappings":​ {
 +          "​nom_du_dossier_du_projet":​ "​${workspaceFolder}"​
 +        },
 +        "​xdebugSettings":​ {
 +          "​max_children":​ 512,
 +          "​max_data":​ 1024,
 +          "​max_depth":​ 5
 +        }
 +      }
 +    ]
 +  }
 +</​code>​
 +  ​
 +==== Serveurs web PHP ====
 +
 +[[:PHP]] permet de lancer un [[:​php#​serveur|serveur web simple]]. Celui-ci peut être utilisé depuis **VScode**.
 +
 +=== Extension Live Server ===
 +
 +Pour tester rapidement les fichiers [[:PHP]] sans avoir à passer par le serveur [[:LAMP]], on peut installer l'​extension "Live Server"​ depuis VSCode ou VSCodium.
 +Configuration:​
 +(//File// -> //​Preferences//​ -> //​Settings//,​ puis on tape ''​Live Server''​ dans la barre de recherche):
   - Executable : ''/​usr/​bin/​php''​   - Executable : ''/​usr/​bin/​php''​
   - PHP.ini : ''/​etc/​php/​8.1/​apache2/​conf.d/​20-xdebug.ini''​ (à adapter, éventuellement)   - PHP.ini : ''/​etc/​php/​8.1/​apache2/​conf.d/​20-xdebug.ini''​ (à adapter, éventuellement)
   - Port : ''​9300''​   - Port : ''​9300''​
-<note important>​J'​ai l'​impression que File server ne fonctionne ​uniquement que dans un dossier créé avant l'ouverture ​de Vscode ou de VScodium. </note>+ 
 +=== Serveur web interne Symfony === 
 + 
 +Le serveur PHP précédent ​fonctionne ​mais le serveur de Symfony est plus complet ​dans le cadre de l'utilisation ​de ce framework. 
 +Pour le lancer: 
 +<​code>​symfony server:​start</​code>​ 
 +pour le stopper: 
 +<​code>​symfony server:stop</code> 
 ===== Désinstallation ===== ===== Désinstallation =====
  
-Si installation via [[#via_deb]], +Pour supprimer cette application,​ il suffit de [[:​tutoriel:​comment_supprimer_un_paquet|supprimer son paquet]]. Selon la méthode choisiela configuration globale de l'​application est conservée ou supprimée. Les journaux du système, et les fichiers de préférence des utilisateurs dans leurs dossiers personnels sont toujours conservés. 
-<​code ​bash>sudo apt autoremove ​code</​code>​+ 
 +  * Pour les versions [[:deb]], vous pouvez passer par le [[:snap store|centre d'​applications]],​ ou en ligne de commande :<​code>​sudo apt remove ​code codium</​code>​ 
 +  * Pour la version **[[:​flatpak#​desinstallation_de_logiciels|Flatpak]]**,​ vous pouvez passer par [[:​gnome-software|GNOME Logiciels]] (si vous avez le //plugin// [[:​gnome-software#​installer_les_greffons_snap_et_flatpak|Flatpak]]),​ ou en ligne de commande :<​code>​flatpak uninstall code codium</​code>​ 
 +  * Pour la version **[[:​snap#​suppression|snap]]**,​ vous pouvez passer par le [[:snap store|centre d'​applications]],​ ou en ligne de commande :<​code>​snap remove code codium</​code>​ 
 +  * Pour la version **[[:​appimage#​desinstaller_un_appimage|Appimage]]**,​ vous devez simplement supprimer le fichier ''​VSCodium.appimage''​.
  
-===== Liens utiles ​=====+===== Voir aussi =====
  
-  * [[https://​visualstudio.developpez.com/​cours-tutoriels/​|Les meilleurs ​cours et tutoriels pour apprendre ​Visual Studio]]+  * [[https://​visualstudio.developpez.com/​cours-tutoriels/​|cours et tutoriels]] pour apprendre ​à utiliser **VSCode** sur [[wpfr>​Developpez.com]] 
 +  * **[[https://​github.com/​coder/​code-server|CODE Server]]** permet d'​utiliser **VSCode** directement installé sur son serveur depuis un navigateur (utile pour gérer directement les fichiers sans jamais avoir à les télécharger - attention par contre à la [[:​sécurité]] de l'​installation !). 
 +  * **[[https://​zed.dev|Zed]]**, une alternative moderne
  
 ---- ----
    
 //​Contributeurs : [[:​utilisateurs:​jusdepatate|Jus de Patate]], [[:​utilisateurs:​krodelabestiole]],​ [[:​utilisateurs:​samcelia]]//​ //​Contributeurs : [[:​utilisateurs:​jusdepatate|Jus de Patate]], [[:​utilisateurs:​krodelabestiole]],​ [[:​utilisateurs:​samcelia]]//​
  • visual_studio_code.1699701164.txt.gz
  • Dernière modification: Le 11/11/2023, 12:12
  • par 2.14.209.128