Table des matières
Visual Studio Code
Raccourcis
Windows:
Move line up/down | Alt+Cmd+Up/Down |
Multiline | Ctrl+Alt+Up/Down |
Duplicate line | ⇧ Shift+Alt+Up/Down |
Mac:
- Opt+Alt+Ctrl pour balancer de Case sensitive ou non lors d'ajout d'occurances par Cmd+D.
Installation macOS
Télécharger et installer le package comme d'habitude.
Pour intégrer Visual Studio Code dans le shell, à partir de l'application Code, installer Install 'code' command in PATH.
Settings
Les préférences sont dans le répertoire du projet, dans le fichier .settings/settings.json
. Pour le fichier settings.json de User Settings, c'est dans ~/Library/Application Support/Code/User/settings.json
.
"editor.fontFamily": "'Fira Code', 'Hack Nerd Font Mono', Menlo, Monaco, 'Courier New', monospace", "editor.fontSize": 15, "editor.fontLigatures": true, "editor.tabSize": 2, "editor.wordWrap": "off", "editor.wordWrapColumn": 300, "extensions.ignoreRecommendations": false, "files.trimTrailingWhitespace": true, "git.confirmSync": false, "git.autofetch": true, "terminal.integrated.fontFamily": "Hack Nerd Font Mono", "terminal.integrated.fontSize": 15, "workbench.startupEditor": "newUntitledFile", "window.zoomLevel": 0, "typescript.referencesCodeLens.enabled": true, "workbench.settings.editor": "json",
Ne pas collecter les données :
"telemetry.enableCrashReporter": false, "telemetry.enableTelemetry": false
Pour le terminal avec Powerline:
"terminal.integrated.fontFamily": "Hack Nerd Font Mono", "terminal.integrated.fontSize": 15 "workbench.colorCustomizations": { "terminal.background": "#000000" },
Launch Config
{ "name": "Launch Front-End App", "type": "chrome", "request": "launch", "url": "http://localhost:3030/", "sourceMaps": false, "webRoot": "." },
Utilisation avec l'extension Debugger for Chrome:
"configurations": [ { "name": "Attach", "type": "chrome", "request": "attach", "port": 9222, "url": "http://localhost:14512/Pages/2", "webRoot": "${workspaceRoot}" } ]
Exemple de configuration pour lancer un backend node en TypeScript sur un monorepo avec le front-end. On utilise ts-node qui est une dépendance du package.json du server et non du projet.
{ "name": "Launch Server", "type": "node", "request": "launch", "cwd": "${workspaceFolder}/app/server", "env": { "NODE_ENV": "development" }, "runtimeArgs": [ "-r", "ts-node/register" ], "args": [ "src/index.ts" ], "sourceMaps": true, "stopOnEntry": false }
Launch Front-End App
Configurer TypeScript
tsconfig.json est créé quand on fait Command+Shift+B (Build) sur un fichier TS et qu'il n'y a pas de Task Runner.
Plugins à installer
Général
- Prettify JSON
- C#
- Paste JSON as Code
- PlantUML (Rich PlantUML support for Visual Studio Code.)
- Polacode (Polaroid for your code)
- Quokka (Live Scratchpad for JavaScript.)
Développement AngularJS / JavaScript
- Angular 1 JavaScript and TypeScript Snippets
- JSCS Linter
- JSHint
Développement Angular2 / TypeScript
- TSLint
- Paste JSON as Code
node / npm
Localisations
Les extensions sont installés là:
- Windows
%USERPROFILE%\.vscode\extensions
- Mac
~/.vscode/extensions
- Linux
~/.vscode/extensions
Développement Angular 7+ Travail
- Angular 7 Snippets
- Angular Language Service
- angular2-switcher
- Beautify
- Bracket Pair Colorizer
- Debugger for Chrome
- EditorConfig for VS Code
- Git History
- GitHub Pull Requests
- GitLens
- Jest et Jest Snippets
- JSONPath StatusBar
- ngx-translate-zombies
- Paste JSON as Code
- Prettier - Code Formatter
- Prettify JSON
- Settings Sync
- stylelint
- TSLint
- TypeScript Hero
- Visual Studio IntelliCode
- VS Live Share
UML avec PlantUML
-
- Installer Graphviz
- Support LaTeX: télécharger jlatexmath
Config dans settings.json
:
"plantuml.diagramsRoot": "docs/diagrams/src", "plantuml.exportOutDir": "docs/diagrams/out", "plantuml.exportSubFolder": false
→ SkinParams : All Skin Parameters
Développement C++
- Plugin à installer: C/C++
Keybindings
Pour associer des raccourcis clavier avec des changements de configuration, on peut utiliser:
Avec Toggle:
{ "key": "F13", "command": "toggle", "when": "editorTextFocus", "args": { "id": "referencesCodeLens", "value": [ {"typescript.referencesCodeLens.enabled": true}, {"typescript.referencesCodeLens.enabled": false} ] } }
Launch.json
{ // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "type": "chrome", "request": "launch", "name": "Launch Chrome against localhost", "url": "http://localhost:4200", "webRoot": "${workspaceFolder}" }, { "type": "node", "request": "launch", "name": "Jest All", "program": "${workspaceFolder}/node_modules/jest/bin/jest", "args": ["--runInBand"], "console": "integratedTerminal", "internalConsoleOptions": "neverOpen" }, { "type": "node", "request": "launch", "name": "Jest Current File", "program": "${workspaceFolder}/node_modules/jest/bin/jest", "args": ["${relativeFile}"], "console": "integratedTerminal", "internalConsoleOptions": "neverOpen", "sourceMaps": true, } ] }
Keybindings
Navigation Back/Forward:
{ "key": "ctrl+left", "command": "workbench.action.navigateBack" }, { "key": "ctrl+right", "command": "workbench.action.navigateForward" },
Switch de Terminal à Éditeur avec Ctrl+^ :
{ "key": "ctrl+[BracketLeft]", "command": "workbench.action.terminal.focus"}, { "key": "ctrl+[BracketLeft]", "command": "workbench.action.focusActiveEditorGroup", "when": "terminalFocus"},
Sauter de 10 lignes avec le curseur:
{ "key": "ctrl+up", "command": "cursorMove", "args": { "to": "up", "by": "line", "value": 10 }, "when": "editorTextFocus" }, { "key": "ctrl+down", "command": "cursorMove", "args": { "to": "down", "by": "line", "value": 10 }, "when": "editorTextFocus" },
Transformation Uppercase/Lowercase:
{ "key": "ctrl+shift+u", "command": "editor.action.transformToUppercase", "when": "editorTextFocus" }, { "key": "ctrl+shift+l", "command": "editor.action.transformToLowercase", "when": "editorTextFocus" }
Multiligne changé à Ctrl-Shift-Up/Down:
{ "key": "ctrl+shift+up", "command": "editor.action.insertCursorAbove", "when": "editorTextFocus" }, { "key": "alt+cmd+up", "command": "-editor.action.insertCursorAbove", "when": "editorTextFocus" }, { "key": "ctrl+shift+down", "command": "editor.action.insertCursorBelow", "when": "editorTextFocus" }, { "key": "alt+cmd+down", "command": "-editor.action.insertCursorBelow", "when": "editorTextFocus" },
Désactiver le zoom sur le Command++/-:
{ "key": "cmd+numpad_add", "command": "-workbench.action.zoomIn" }, { "key": "cmd+numpad_subtract", "command": "-workbench.action.zoomOut" },
Theme customization
"editor.tokenColorCustomizations": { "textMateRules": [ { "scope": [ "storage.modifier", // private, public ], "settings": { "fontStyle": "", } }, { "scope": [ "variable", "variable.language", "variable.name", "variable.other", "variable.other.readwrite", "variable.parameter", ], "settings": { "foreground": "#888888" } }, { "scope": [ "comment", "comment.block", "comment.block.documentation", "comment.line", ], "settings": { "foreground": "#444444", } } ] }
Workbench
"workbench.colorCustomizations": { "terminal.background": "#040404", // "window.activeBorder": "#56ff34", "activityBar.activeBackground": "#333333", "[Black Ocean]": { "list.inactiveSelectionBackground": "#019d7630" } },
Tasks
Fichier: .vscode/tasks.json
.
{ "version": "2.0.0", "tasks": [ { "label": "tsc watch", "type": "shell", "command": "tsc", "args": ["--watch", "--inlineSourceMap", "--project", "./path/to/tsconfig.json"] } ] }