Affichage des articles dont le libellé est VSCode. Afficher tous les articles
Affichage des articles dont le libellé est VSCode. Afficher tous les articles

mardi 25 avril 2023

C'est quoi le format fichier SVG ?

Depuis que je travaille avec MAUI, je me retrouve avec des fichiers ressources ayant l'extension SVG.. Alors c'est quoi ce format de fichiers SVG ?

SVG c'est pour Scalable Vector Graphics, les fameuses images vectorielles, celles qui ne se pixelisent pas.

Format d'images SVG

L'avantage de l'image vectorielle, c'est qu'elle ne pixelise pas lorsque qu'elle change de taille, plus petite ou plus grande, elle conserve la même netteté. Elle est moins gourmandes en ressources. Elle peut être animée grâce aux CSS.

kinsta - Comment ouvrir un fichier SVG

En même c'est normal que la technologie MAUI (Multiplateform) utilise les images vectorielles puisque les applications doivent s'adapter à toutes les plateformes, avec de petits ou de grands écrans, donc des images vectorielle.

En cherchant un peu sur les images, les icônes et les fichiers SVG, je tombe sur :

Microsoft - Visual Studio Image Library

C'est toujours bon à prendre. Il s'agit d'une collection d'images SVG accessibles en cliquant sur la page HTML Pour chaque image, il y a un fichier png un fichier svg et un xaml qui permettent de les intégrer dans toutes les applications.

Puis je me dis que le meilleur outil pour travailler des images, c'est GIMP mais je trouve un tutorial qui me dit le contraire :

GimpTutorial - how-to-make-svg-file

Gimp is not the best tool to make SVG !? 

Très bien, alors c'est quoi le meilleur outil pour traiter les fichiers SVG ? Et là c'est la cata la folie de captation créer un compte recevoir des emails bla bla bla pas encore un seul outil performant et simple pour prendre en compte mes images SVG.

Bon je vais me débrouiller autrement !

En effet, j'ai essayé d'ouvrir un fichier .SVG avec Gimp. Il s'est ouvert, j'ai bien pu visualiser son contenu mais au moment de sauver c'est la cata, aucune extension .svg n'est connue de Gimp du coup il sauvegarde un truc inutilisable.

Et voilà que je reviens avec ça :

freecodecamp - Things you need to know about working with svg in VS Code

Là on me dit d'utiliser VS Code pour traiter mes fichiers SVG, dans Extensions je tape SVG :

Extension SVG pour Visual Studio Code
Extension SVG pour Visual Studio Code

Mais là je ne peux faire qu'un Minify SVG alors je cherche une autre extension, SVG Preview :

SVG Extensions pour VS Code
SVG Extensions pour VS Code

Seulement je travaille avec MAUI et j'aimerais particulariser l'icône de mes applications. Le ".NET" sur fond violet ne me plait plus guère !

Seulement voilà le thème de mon VS Code est Light donc blanc. Je ne vois pas le".NET" qui est donc blanc sur fond blanc. Je modifie le Thème de mon VS Code et voilà, le .NET apparaît :

Extension SVG Preview pour VS Code
Extension SVG Preview pour VS Code

Donc le meilleur outil (que j'ai trouvé) pour travailler les images vectorielles SVG, c'est VS Code avec l'extension Svg Preview.

Et sinon pour faire un petit coucou à Mads Kristensen, vous avez également une extension pour Visual Studio qui n'est pas mal du tout car vous avez de l'IntelliSense pour modifier votre fichier SVG si vous le souhaitez.

GitHub - madskristensen - SvgViewer: Shows the rendered image of .svg files

That's All Folks!

lundi 14 novembre 2022

WSL - Windows Subsystem for Linux - Comment passer à WSL 2 ?

C'est quoi WSL (Windows Subsystem for Linux), je viens d'installer l'extension dans VSCode mais j'ai besoin de clarifier le terme Windows Subsystem for Linux car j'ai installé cette extension dans mon VSCode uniquement pour faire tourner du soft BLE-SERIAL mais à part cela ... J'ai besoin d'aller plus loin avec WSL, suivez-moi.

Pour l'instant WSL c'est une toute petit icône verte (><) en bas à gauche de la barre d'état de mon VSCode pour avoir cela j'ai installé l'extension WSL dans VSCode.

Comparing WSL1 and WSL 2

Je peux constater que WSL 2 est sans doute beaucoup mieux pour ce que j'ai à faire : "Docker Desktop's WSL back-end" and "use Dev Containers".

Mais commençons par-là :

WSL Getting Started Tutorial

Vérifier la fonctionnalité de Windows pour WSL

Pour aller vérifier que la case Sous-système Windows pour Linux est cochée c'est dans :

Panneau de configuration > Programmes et fonctionnalités > Activer ou désactiver des fonctionnalités Windows 

Cocher la case Sous-système Windows pour Linux
Cocher la case Sous-système Windows pour Linux

On vérifie que WSL est opérationnel dans une command-dos ou PowerShell : 

>wsl

Là, je me connecte à la distrib Ubuntu installée.

WSL dans VSCODE 

Dans VSCode, je clique sur l'icône verte en bas à gauche :

La popup d'information me recommande vivement d'effectuer la mise à niveau vers WSL 2 pour améliorer les performances.

Je dois maintenant passer de WSL 1 à WSL 2 ...

Mettre à niveau la version de WSL 1 à WSL 2

Pour connaitre ma version actuelle de WSL, je lance la commande :

PS>wsl -l -v

Pour tenter une mise à jour vers la version 2, voici la commande :

PS >wsl --set-version Ubuntu-20.04 2

Et ça commence, j'en étais sûr mon petit doigt me disait que ce ne serait pas sans douleur :

WSL 2 nécessite une mise à jour de son noyau
WSL 2 nécessite une mise à jour de son noyau

PS C:\Windows\system32> wsl --set-version Ubuntu-20.04 2
La conversion est en cours. Cette opération peut prendre quelques minutes...
Pour plus d’informations sur les différences de clés avec WSL 2, visitez https://aka.ms/wsl2
WSL 2 nécessite une mise à jour de son composant noyau. Pour plus d’informations, visitez https://aka.ms/wsl2kernel

Je vais passer par là :

Etape 4 : télécherger le package de mise à jour du noyau Linux

Je télécharge wsl_update_x64.msi :

wsl_update_x64.msi

Je relance la commande de mis à jour vers WSL 2 :

PS >wsl --set-version Ubuntu-20.04 2

PS C:\Users\Mabyre> wsl -l -v
  NAME            STATE           VERSION
* Ubuntu-20.04    Stopped         1
PS C:\Users\Mabyre> wsl --set-version Ubuntu-20.04 2
La conversion est en cours. Cette opération peut prendre quelques minutes...
Pour plus d’informations sur les différences de clés avec WSL 2, visitez https://aka.ms/wsl2
Activez la fonctionnalité Windows de plateforme de machine virtuelle et assurez-vous que la virtualisation est activée dans le BIOS. Pour plus d’informations, rendez-vous sur https://aka.ms/wsl2-install

Pffff... Et pourtant la virtualisation est activée dans mon BIOS. En fait j'ai sauté une étape.

Je regarde alors Ici :

Étapes 3 - d’installation manuelle pour les versions antérieures de WSL | Microsoft Learn

Du coup, j'exécute la commande suivante :

PS>dism.exe /online /enable-feature /featurename:VirtualMachinePlatform /all /norestart

Résultat : Ok

Je restart quand même ...

Et je relance la commande pour passer en WSL 2 :

PS >wsl --set-version Ubuntu-20.04 2

Comment passer de WSL1 à WSL 2
Comment passer de WSL1 à WSL 2
Cette fois ça y est !

PS C:\Windows\system32> wsl -l -v
  NAME            STATE           VERSION
* Ubuntu-20.04    Stopped         2

Ah ben ce n'est pas trop tôt, je commençais à désespérer d'autant que mes incursions de le BIOS de la machine (F2 puis bouton allumage) n'étaient pas fructueuses pour activer la virtualisation sur un AMD Ryzen 5 ... (pas d'option pour activer la virtualisation).

Voilà vous venez de voir comment passer de WLS1 à WSL 2.

Je vais pouvoir passer à la découverte de tout ce que l'on peut faire avec WSL 2...

Have fun!

mercredi 2 février 2022

VSCode (Visual Studio Code) L'hôte d'extension crash constamment

Ce matin dans mon VSCode sous Windows 7, plantage de Visual Studio Code ... il est stoppé sur une page blanche et Windows me demande de "Terminer" ou "d'attendre", dans ce cas je préfère attendre un peu, on ne sait jamais une mise à jour est peut-être en cours mais rien à faire, je suis obligé de "Terminer VSCode" !

Error : La fenêtre s'est bloquée (raison : "oom", code : "-536870904") !
Error : La fenêtre s'est bloquée (raison : "oom", code : "-536870904") !

Ce qui me surprend, c'est qu'au début, c'est un plantage grave, sans reprise possible, VSCode se met en mode plantage complet, page blanche. Puis je relance et je commence à avoir des messages plus explicites.

VSCode plantage sous Windows 7

Je vais regarder sur Internet, on me dit d'ajouter l'option :

--disable-gpu

Dans les propriétés de démarrage de VSCode. Ce n'est pas la solution et ce problème est très ancien.

VSCode plantage sous Windows 7

C'est le Terminal PlatformIO CLI qui fait crasher VSCode. Je pense plutôt que j'ai un problème de connexion à Internet ou/et de mise à jour d'une extension.

Sinon je lie une bonne chose à faire dans le cas de crash réguliers de Visual Studio Code :

Supprimer les fichiers temporaires de VSCode .user suo

Vous avez également des crashs fréquent de Visual Studio Code, vous avez trouvé une solution, n'hésitez pas à laisser votre commentaire.

Pour ma part, le plantage continuel de VSCode avec le message : La fenêtre s'est bloquée (raison : "oom", code : "-536870904") était du à l'utilisation des versions de l'extension PlatformIO.

Suite à de nombreuses expériences Arduino .platformio s'est vu installée avec plusieurs versions du package atmelavr :

toolchain-atmelavr@1.50400.190710

et

toolchain-atmelavr@1.70300.191015

Dans mon projet VSCode, il y était fait référence grâce au fichier Json : launch.json :

Plantage VSCode du à l'utilisation du versionning d'extension
Utilisation de toolchain-atmelavr@1.70300.191015 pour versionner un package

En supprimant ces versions et en installant la dernière préconisées -> plus de plantage ! rectification -> moins de plantage.

Mise à jour février 2022

Alors non, les plantages sont moins fréquents mais ont toujours lieu, environ deux à trois par jour c'est assez curieux voir flippant, la cause n'en est que plus difficile à trouver. 

C'est lié au Terminal "PlatformIO CLI". 

J'ai vu apparaître un petit bout de code dans le fichier .vscode/extensions.json :

    "unwantedRecommendations": [
        "ms-vscode.cpptools-extension-pack"
    ]

A mon humble avis, ce problème de crash de VSCode intempestif, n'est pas prêt d'être résolu.

Autre remarque : Le rappel des commandes par "flêche haut" et "flêche bas" qui fonctionnait d'un terminal à l'autre, bien pratique quand on est amené "à terminer" souvent un terminal, ne fonctionne plus ...

Sur un blog on me dit d'essayer : >pio update 

VSCode crashes avec PlatformIO extension
VSCode crashes avec PlatformIO - pio update

Mais tout est vert donc cela ne devrait pas résoudre mon problème mais pourtant depuis plus de plantages de VSCode, alors l'ensemble de ces mise à jour aura fini résoudre ce plantage ...

mercredi 12 février 2020

Visual Studio Code et le Contrôle de Version GitHub

C'est bien Visual Studio Code c'est un bel outil très différent de Visual Studio, il s'installe très rapidement et permet de développer dans à peu prêt n'importe quel langage. Ce qui est bien avec Visual Studio Code c'est qu'un projet ce n'est pas un fichier .csproj et une solution .sln propriétaire, c'est un répertoire racine un peu comme dans Eclipse.

Pour ouvrir un projet, il suffit d'ouvrir le répertoire racine des sources dans Visual Studio Code et il se débrouille tout seul. Alors comme j'ai un vieux projet en Langage C à traiter et qu'à l'époque j'étais avec Eclipse vous imaginez qu'utiliser VS Code pour remanier quelque peu les codes source de ce projet ce serait magnifique.

Et maintenant, je me créé un Repository Git pour y commiter mes sources alors quel support j'ai pour Git Hub dans Visual Studio Code ?


Le nouvel éditeur de codes source - Visual Studio Code
Le nouvel éditeur de codes source - Visual Studio Code

Au passage, on note une petite pique contre GitHub car Microsoft préconise plutôt Team Azure comme Repository plutôt que GitHub mais après tout c'est de bonne guerre.

Private Host Git provider - Azure DevOps

Visual Studio Code - Version Control

Donc avec Visual Studio Code, j'ai ouvert le répertoire de mes sources en langage C, j'ai cliqué sur l'icône "Source Contrôle" (ou Built-in Git"), j'ai cliqué sur le + pour ajouter tous mes sources. je n'ai plus qu'une question :

Visual Studio Code - How to configure a remotes repository to publish ?

Et là c'est curieusement StackOverFlow qui me répond :

stackoverflow - Visual Studio Code - Connect to remote GIT repository and PUSH local files to new remote Repository

Mais (bip) que c'est compliqué en ligne commande ...  Alors qu'il y a plein de commandes à cet endroit là de Visual Studio Code  :


Visual Studio Code et Git en ligne de commande
Visual Studio Code intègre Git en ligne de commande

C'est pas fun ! Pas fun du tout ! En fait stackoverflow ne répond pas à ma question qui est pourtant simple :

Visual Studio Code - How to configure a remotes repository to publish

Car quand je clique dans Visual Studio Code sur la commande "push to" il me répond :

Your Repository has no remotes configured to publish to.
Your Repository has no remotes configured to publish to.

J'ai beau cliqué sur la rondelle ...

Your Repository has no remotes configured to publish to - Manage Extension

J'arrive sur Git VS Code - Git SCM Integration ...


Visual Studio Code - Git Intégration
Visual Studio Code - Git Intégration

C'est là que j'ai une fulgurance ... ne faudrait t-il pas installer une extension pour GitHub ?

Je tape GitHub dans "EXTENSIONS: MARKETPLACE" :

GitHub KnisPeter

J'installe l'extension GitHub pour Visual Studio Code là je pense que je tiens le bon bout.

No fun at all!

Non en fait pas du tout, je ne suis pas sur la bonne piste, j'utilise toutes les commandes correctement depuis VS Code qui est positionné sur le répertoire que je souhaite Commiter dans GitHub. Mais rien n'y fait.

Your repository has no remotes configured to push to

Solution :

Et puis je me rappelle que j'avais déjà réussi à gérer mes codes source depuis Visual Studio, je regarde un peu dedans le me dis qu'avec Visual Studio, je suis connecté avec un utilisateur alors que VS Code ne me le propose pas.

CQFD ! J'ouvre la console Git et je tape la commande suivante :

>git config --list


>git config --list
>git config --list

Je regarde le user.name et le user.email et je me dis que ce sont ceux de mon compte Azure Cloud alors que je cherche à me connecter à GitHub !

Voilà, il ne me reste plus qu'à lire la page suivante :

git-scm - 1.6 Démarrage rapide - Paramétrage à la première utilisation de Git

A la rubrique "Votre identité" pour connaitre les commandes pour changer d'identité dans Git.

> git config --global user.name "John Doe"
> git config --global user.email johndoe@example.com

Pas très fun!