Indentation et mise en forme CSS du code Visual Studio
J'aimerais savoir s'il existe un moyen d'activer le retrait automatique d'un fichier CSS dans le code Visual Studio avec le raccourci ALT+SHIFT+F?
Cela fonctionne bien avec JavaScript mais étrangement pas avec CSS.
Oui, essayez d'installer vscode-css-formter extension . Il ajoute simplement la fonctionnalité pour formater les fichiers .css et le raccourci reste le même Alt+Shift+F.
pour exécuter cette
entrez alt+shift+f
ou
appuyez sur F1 ou ctrl+shift+p puis entrez beautify ..
un autre - JS-CSS-HTML Formatter
je pense que cette extension utilise à la fois js-beautify en interne
Nous avons perdu une heure à trouver la meilleure option.
Il suffit de l'assembler pour en faciliter la lecture et en choisir un.
Remarques:
- CSS et SASS/SCSS/LESS sont tous liés
- HTML, Javascript, TypeScript, JSON - le code de VS est déjà formaté
- CSS et connexes - Le code de VS est au format pas à la date d'aujourd'hui
Options:
- Pour formater css/sass/scss/less:
- https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
- Tous les css liés sont supportés, et pas les autres, je choisis ça, ça marche super.
- https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
- Pour formater JavaScript/TypeScript/CSS:
- https://marketplace.visualstudio.com/items?itemName=michelemelluso.code-beautifier
- mais, déjà, JS, TS sont pris en charge par le code VS
- https://marketplace.visualstudio.com/items?itemName=michelemelluso.code-beautifier
- Pour formater les fichiers JS, CSS, HTML, JSON (enveloppe js-beautify)
- https://marketplace.visualstudio.com/items?itemName=lonefy.vscode-JS-CSS-HTML-formatter
- mais, déjà, JS, HTML, JSON sont pris en charge par le code VS
- https://marketplace.visualstudio.com/items?itemName=lonefy.vscode-JS-CSS-HTML-formatter
- Pour formater CSS
- https://marketplace.visualstudio.com/items?itemName=aeschli.vscode-css-formatter
- mais seulement CSS supporté, pas tous les liés - pas maintenu plus de 6 mois
- https://marketplace.visualstudio.com/items?itemName=aeschli.vscode-css-formatter
Formater:
Appuyez sur Alt + Maj + F dans le code VS
par exemple, après l’installation du Prettier
J'espère que cela pourra aider.
Après avoir ouvert le répertoire bootstrap.min.css dans le code Visual Studio, le résultat semblait indigne .. J'ai essayé la combinaison ALT + Maj + F mais en vain.
Puis installé
Formateur CSS extension.
Rechargé et ALT + Maj + F indenté mon fichier CSS avec charme.
Bingo !!!
Il y en a plusieurs dans la galerie, mais celle que j'utilise, qui offre un niveau considérable de configurabilité et qui reste discrète pour le reste des paramètres est Beautify de Michele Melluso . Il fonctionne à la fois en CSS et en SCSS et vous permet de mettre en retrait 3 espaces en conservant le reste du code sur 2 espaces, ce qui est Nice.
Vous pouvez le récupérer à partir de GitHub et l’adapter vous-même, si vous en avez envie aussi.
Installez l'extension HookyQR.beautify. Il embellira votre code javascript, JSON, CSS, Sass et HTML dans Visual Studio Code. Ce sont les extensions les plus utilisées à cet effet
Je recommande d'utiliser Prettier car il est très extensible mais fonctionne toujours parfaitement tel quel:
1. CMD + Shift + P -> Format Document
ou
1. Select the text you want to Prettify
2. CMD + Shift + P -> Format Selection
Allez dans le menu Fichiers -> Préférences -> Extentions Ensuite, tapez CSS Formatter, attendez qu'il se charge et cliquez sur Installer.