Outils pour utilisateurs
divers:visual_studio_code
Différences
Ci-dessous, les différences entre deux révisions de la page.
| Les deux révisions précédentes Révision précédente Prochaine révision | Révision précédente | ||
|
divers:visual_studio_code [2022/03/06 15:51] marclebrun [Mon fichier settings.json] |
— (Version actuelle) | ||
|---|---|---|---|
| Ligne 1: | Ligne 1: | ||
| - | ====== VSCode / VSCodium ====== | ||
| - | |||
| - | |||
| - | |||
| - | ===== Installation sous Debian 10 ===== | ||
| - | |||
| - | * Aller sur [[https://code.visualstudio.com/docs/setup/linux]] | ||
| - | * Télécharger le fichier depuis le lien **.deb package (64-bit)** | ||
| - | * Installer avec la commande suivante : | ||
| - | |||
| - | <code bash> | ||
| - | su | ||
| - | cd /home/marc/Téléchargements | ||
| - | apt install ./code_1.40.2-1574694120_amd64.deb | ||
| - | </code> | ||
| - | |||
| - | ===== Extensions que j'utilise ===== | ||
| - | |||
| - | ==== Bracket Pair Colorizer ==== | ||
| - | |||
| - | {{:divers:screenshot_20211010_072020.png|}} | ||
| - | |||
| - | ==== SQLite ==== | ||
| - | |||
| - | {{:divers:screenshot_20201225_161153.png|}} | ||
| - | |||
| - | Pour qu'elle fonctionne sous **Ubuntu 20.04** il faut installer le paquet **sqlite** | ||
| - | |||
| - | <code bash> | ||
| - | sudo apt install sqlite | ||
| - | </code> | ||
| - | |||
| - | Source: [[https://github.com/AlexCovizzi/vscode-sqlite/issues/119]] | ||
| - | |||
| - | ==== Database Client ==== | ||
| - | |||
| - | Supporte MySQL/MariaDB, Microsoft SQL Server, PostgreSQL, SQLite, MongoDB, Redis, et ElasticSearch. | ||
| - | |||
| - | {{:divers:screenshot_20211115_235702.png|}} | ||
| - | |||
| - | ==== Git History ==== | ||
| - | |||
| - | {{:divers:screenshot_20211010_072232.png|}} | ||
| - | |||
| - | ==== Live Sass Compiler ==== | ||
| - | |||
| - | {{:divers:screenshot_20211010_072334.png|}} | ||
| - | |||
| - | ==== Live Server ==== | ||
| - | |||
| - | {{:divers:screenshot_20211010_072428.png|}} | ||
| - | |||
| - | ==== Twig ==== | ||
| - | |||
| - | {{:divers:screenshot_20211010_072538.png|}} | ||
| - | |||
| - | * Ouvrir un fichier **html** | ||
| - | * Dans la barre de status, le type de fichier **HTML** est indiqué | ||
| - | * Cliquer sur ce type de fichier et sélectionner la commande **Configure file association for '.html'** | ||
| - | * Sélectionner **HTML (Twig)** | ||
| - | |||
| - | ==== Jinja 2 ==== | ||
| - | |||
| - | {{:divers:screenshot_20211129_070558.png|}} | ||
| - | |||
| - | Pour l'associer aux fichiers **html**, ajouter ceci dans les paramètres : | ||
| - | |||
| - | <code javascript> | ||
| - | "files.associations": { | ||
| - | "*.html": "jinja-html" | ||
| - | }, | ||
| - | </code> | ||
| - | |||
| - | {{:divers:screenshot_20211129_070925.png|}} | ||
| - | |||
| - | |||
| - | ==== Python ==== | ||
| - | |||
| - | {{:divers:screenshot_20210428_064723.png|}} | ||
| - | |||
| - | ==== Prettier - Code Formatter ==== | ||
| - | |||
| - | {{:divers:screenshot_20211010_072803.png|}} | ||
| - | |||
| - | ==== Rainbow CSV ==== | ||
| - | |||
| - | {{:divers:screenshot_20211010_072932.png|}} | ||
| - | |||
| - | ==== XML ==== | ||
| - | |||
| - | {{:divers:screenshot_20211010_073029.png|}} | ||
| - | |||
| - | |||
| - | |||
| - | ===== Activer Emmet ===== | ||
| - | |||
| - | **Emmet** est actif par défaut pour le langage **HTML** | ||
| - | |||
| - | ==== Fichiers TWIG ==== | ||
| - | |||
| - | Il faut dire à Emmet que les fichiers avec extension **twig** sont à | ||
| - | considérer comme étant dans le langage **html** : | ||
| - | |||
| - | * **Ctrl+Shift+P** (command palette) > Preferences: Open Settings (JSON) | ||
| - | * Dans **settings.json**, ajouter ou compléter cette section : | ||
| - | |||
| - | <code javascript> | ||
| - | "emmet.includeLanguages": { | ||
| - | "twig": "html", | ||
| - | }, | ||
| - | </code> | ||
| - | |||
| - | ==== Fichiers HTML si ''Better Jinja'' est installé ==== | ||
| - | |||
| - | Emmet ne fonctionne plus dans les fichiers **html** puisqu'un setting a été | ||
| - | modifié pour associer cette extension au langage **jinja-html**. | ||
| - | |||
| - | <code javascript> | ||
| - | "files.associations": { | ||
| - | "*.html": "jinja-html" | ||
| - | }, | ||
| - | </code> | ||
| - | |||
| - | Il faut donc indiquer à Emmet qu'il doit être actif pour le langage **jinja-html** | ||
| - | comme pour le langage **html**, en complétant cette section : | ||
| - | |||
| - | <code javascript> | ||
| - | "emmet.includeLanguages": { | ||
| - | "html": "html", | ||
| - | "jinja-html": "html" | ||
| - | } | ||
| - | </code> | ||
| - | |||
| - | **Note:** les paramètres sont appliqués dès qu'on sauvegarde le fichier **settings.json**. | ||
| - | |||
| - | |||
| - | ===== Indentation de l'arbre (File Explorer) ===== | ||
| - | |||
| - | L'indentation par défaut est de **8** pixels. Pour plus de clarté je l'augmente | ||
| - | un peu. | ||
| - | |||
| - | **Settings** > **Workbench** > **Appearance** > **Tree: Indent** | ||
| - | |||
| - | {{:divers:screenshot_20201213_190655.png?nolink|}} | ||
| - | |||
| - | |||
| - | ===== Mes raccourcis clavier personnalisés ===== | ||
| - | |||
| - | | View: Toggle Integrated Terminal ^ Ctrl+T Ctrl+T ^ | ||
| - | | View: Toggle Maximized Panel ^ Ctrl+M Ctrl+M ^ | ||
| - | |||
| - | Fichier de configuration : | ||
| - | |||
| - | <code javascript /home/marc/.config/Code/User/keybindings.json> | ||
| - | // Place your key bindings in this file to override the defaultsauto[] | ||
| - | [ | ||
| - | { | ||
| - | "key": "ctrl+t ctrl+t", | ||
| - | "command": "workbench.action.terminal.toggleTerminal" | ||
| - | }, | ||
| - | { | ||
| - | "key": "ctrl+m ctrl+m", | ||
| - | "command": "workbench.action.toggleMaximizedPanel" | ||
| - | } | ||
| - | ] | ||
| - | </code> | ||
| - | |||
| - | ===== Cacher les dossiers __pycache__ de Python ===== | ||
| - | |||
| - | Ajouter ceci à **settings.json** : | ||
| - | |||
| - | <code javascript> | ||
| - | "files.exclude": { | ||
| - | "**/*.pyc": {"when": "$(basename).py"}, | ||
| - | "**/__pycache__": true, | ||
| - | } | ||
| - | </code> | ||
| - | |||
| - | ===== Mon fichier settings.json ===== | ||
| - | |||
| - | Depuis la **Command Palette** (''Ctrl+Shift+P'') sélectionner **Preferences: Open Settings (JSON)** | ||
| - | |||
| - | <code javascript /home/marc/.config/Code/User/settings.json> | ||
| - | { | ||
| - | "files.associations": { | ||
| - | "*.html": "jinja-html" | ||
| - | }, | ||
| - | "workbench.tree.indent": 24, | ||
| - | "emmet.triggerExpansionOnTab": true, | ||
| - | "emmet.includeLanguages": { | ||
| - | "html": "html", | ||
| - | "jinja-html": "html" | ||
| - | }, | ||
| - | "files.exclude": { | ||
| - | "**/*.pyc": {"when": "$(basename).py"}, | ||
| - | "**/__pycache__": true, | ||
| - | } | ||
| - | } | ||
| - | </code> | ||
| - | |||
divers/visual_studio_code.1646581912.txt.gz · Dernière modification: 2022/03/06 15:51 par marclebrun
Outils de la page
Sauf mention contraire, le contenu de ce wiki est placé sous les termes de la licence suivante : CC Attribution-Share Alike 4.0 International
