web-dev-qa-db-fra.com

Comment formater le code lors de l'enregistrement dans VS Code

Je souhaite formater automatiquement le code TypeScript à l'aide du formateur intégré lorsque j'enregistre un fichier dans Visual Studio Code.

Je connais les options suivantes, mais aucune d’elles n’est suffisante:

  • Formater manuellement Shift + Alt + F
  • Format sur type "editor.formatOnType": true
    • Il formate la ligne lorsque vous appuyez sur Entrée. Malheureusement, il reste non formaté lorsque vous cliquez sur une autre ligne ou appuyez sur la flèche haut/bas.
  • Utiliser l'extension existante
    • J'ai essayé ceci n , mais cela ne semble pas très bien fonctionner.
  • Utilisez embellir "beautify.onSave": true
    • Cela ne fonctionne pas avec TypeScript
  • Écrire une extension personnalisée
    • C'est délicat si vous voulez gérer les sauvegardes automatiques et les construire correctement.
visual-studio-codevscode-settingscode-formatting
126
Tomas Nikodym

Depuis septembre 2016 (VSCode 1.6), ceci est maintenant officiellement supporté .

Ajoutez ce qui suit à votre fichier settings.json:

_"editor.formatOnSave": true
_
188
Tomas Nikodym

Pour formater automatiquement le code lors de la sauvegarde:

  • Presse Ctrl, ouvrir les préférences de l'utilisateur

  • Entrez le code suivant dans le fichier de paramètres ouvert

    {
    "editor.formatOnSave": true
}

  • Enregistrer le fichier

Source

42
student

Si vous souhaitez mettre en forme automatiquement lors de l’enregistrement uniquement avec une source Javascript, ajoutez celui-ci dans Users Setting (appuyez sur Cmd, ou Ctrl,):

"[javascript]": { "editor.formatOnSave": true }
21
Long Nguyen

Plus besoin d'ajouter de commandes. Pour ceux qui découvrent Visual Studio Code et qui recherchent un moyen simple de formater le code lors de la sauvegarde, veuillez suivre les étapes ci-dessous.

  1. Ouvrez les paramètres en appuyant sur [Cmd+,] sur Mac ou en utilisant la capture d'écran ci-dessous.

VS Code - Open Settings Command Image

  1. Tapez ' format ' dans le champ de recherche et activez l'option ' Format on Save '.

enter image description here

Vous avez terminé. Je vous remercie.

14
Balasubramani M

Pour l'utilisateur MAC, ajoutez cette ligne à vos paramètres par défaut.

Le chemin du fichier est:/Utilisateurs/NOM_UTILISATEUR/Bibliothèque/Support d'application/Code/Utilisateur/settings.json

"tslint.autoFixOnSave": true

Exemple de fichier serait:

{
    "window.zoomLevel": 0,
    "workbench.iconTheme": "vscode-icons",
    "TypeScript.check.tscVersion": false,
    "vsicons.projectDetection.disableDetect": true,
    "TypeScript.updateImportsOnFileMove.enabled": "always",
    "eslint.autoFixOnSave": true,
    "tslint.autoFixOnSave": true
}
2
Richard