VS Code Configurations

VS Code Configurations
VS Code on WSL
- Install npm

code command

# open code with current directory
code .

# open the current directory in the most recently used code window
code -r .

# create a new window
code -n

# change the language
code --locale=es

# open diff editor
code --diff <file1> <file2>

# open file at specific line and column <file:line[:character]>
code --goto package.json:10:5

# disable all extensions
code --disable-extensions .

# when reading from stdin, so you immediately get back to the terminal prompt.
# https://code.visualstudio.com/updates/v1_86#_do-no-enforce-wait-when-reading-from-stdin-from-the-command-line

curl https://httpbin.org/json | code -

ref: https://code.visualstudio.com/docs/getstarted/tips-and-tricks

setting.json

Mac: $HOME/Library/Application Support/Code/User/settings.json
Linux: $HOME/.config/Code/User/settings.json
Windows: %APPDATA%\Code\User\settings.json

You can open user settings from UI:

- Cmt + p
- type: "> user settings"

editor.formatOnSave

"editor.formatOnSave": true,   // Formating in saving
"editor.formatOnType": true,   // Formating in typing
"editor.formatOnPaste": true,  // Formating in pasting

Usually setting this in selecting like this as this has a big impact:

  "[go]": {
    "editor.formatOnSave": true
  },

editor.renderWhitespace

display space as "･"

"editor.renderWhitespace": "[none|all|boundary]"

none: don't show whitespace
all: show all whitespace with "･" <<<< my preference
display: only the beginning and end of lines

editor.mouseWheelZoom

Ctrl + Scroll allows to scale in/out only the editor's characters (NOT whole editor's characters)

"editor.mouseWheelZoom": true

Python Per directory

cd YOURDIR
ln -s ~/dev/venv3.6 .env

Python Global Configuration

As instructed in Using Python environments in VS Code, Add python.pythonPath to your global settings.

Code > Preferences > Settings
Add Python keyword in Search Settings box
Click Edit in settins.json

Add python.pythonPath to User Settings

{
    "window.zoomLevel": 1,
    "python.jediEnabled": false,
    "python.pythonPath": "/Users/yoichika/dev/venv3.6/bin/python",   <<<<
    "editor.autoIndent": false,
    "editor.wordWrap": "on",
    "workbench.settings.settingsSearchTocBehavior": "hide",
    "go.gopath": "/Users/yoichika/dev/go",
    "go.formatOnSave": true,
    "azureFunctions.showProjectWarning": false
}

Or you can set Python Interpreter using Command Palette: Python: Select Interpreter

Ruby Tag Jump

Open setting, and type ruby
Change Intellisense: false -> rubyLocate
Restart

ref: https://www.fuwamaki.com/article/404

Gist

install Gist extension
Click GIST in footer menu in VS Code and select profile to initialize the profile selector
Add PAT for GIST

Display Language

Open control panel, and select preferred lang in Configure Display Language
Restart vscode

Code Sync Settings

Settings Sync is officially supported. Please refer to this.

The following are deprecated configuration steps.

Install Settings Sync
By following instructions of Settings sync, Get Github Personal Access Token
For Uploading
- (Initial only) Shift + Alt + U => Input your Personal Access Token: this will generate Gist ID
- Shift + Alt + U => Upload Settings
For downloading
- (Initial only) Shift + Alt + D => Input your Personal Access Token and Gist ID
- Shift + Alt + D => Download Settings

Configuration files:

# Mac
## Main Confiuguration for Settings Sync
$HOME/Library/Application Support/Code/User/syncLocalSettings.json
## Gist ID is put in settings.json
$HOME/Library/Application Support/Code/User/settings.json

Editor Config

https://editorconfig.org/

vi ~/.editorconfig

Prefer Go to Source Definition

Enable the following options in settings:

JavaScript: Prefer Go to Source Definition
TypeScript: Prefer Go to Source Definition

Vim Plugin

Press, Hold, and Key Repeating

For MacOS, to enable key-repeating execute the following in your Terminal and restart VS Code:

# For VS Code
defaults write com.microsoft.VSCode ApplePressAndHoldEnabled -bool false
# For VS Code Insider
defaults write com.microsoft.VSCodeInsiders ApplePressAndHoldEnabled -bool false
# do this Just in case
defaults write NSGlobalDomain ApplePressAndHoldEnabled -bool false

# If necessary, reset global default
defaults delete -g ApplePressAndHoldEnabled

Then, quit and start VSCode, not simply reloading VSCode window

references

Workbench

tree indent:

Settings > Workbench > Tree (default indent 8 up to 40)

"workbench.tree.indent": 8 (default = 8, but 20+ is recommended)

Workspaces

Multi-root workspaces: https://code.visualstudio.com/docs/editor/multi-root-workspaces
Manage multiple worspaces (projects): use an extension, Project Manager

Extension

Whitespace+
- Whitespace+ Toggle => show all tabs + space
Settings Sync
Editor Config
vim
Docker
GitLens
Live Share
Go
Protobuf Support
C#
npm Intellisense
VS Code for Node.js
Python
Settings Sync
Kubernetes
YAML
Markdown All in One
Markdown Preview Enhanced
Markdown TOC
Monnlight
REST Client
GitHub Codespaces
Task Explorer

Color Theme

Dracula

https://draculatheme.com/visual-studio-code/

git clone https://github.com/dracula/visual-studio-code.git ~/.vscode/extensions/theme-dracula
cd ~/.vscode/extensions/theme-dracula
npm install
npm run build

Keybindings (Mac)

Show Shortcuts: Cmd+k, Cmd+s
Relaod: Cmd+R
Command Palette: Cmd + B
Slidebar On/Off: Cmd + B
Window Split (Vertical): Cmd + \
Window Split (Horizontal): Cmd + k, Cmd + \
Widonw Close: Cmd + w
Window move: Cmd + 1,2,3,4...
Change language mode: Cmd + K, M
Keyword Search:
- Search text in a file: Cmd + F
- Search files in explorer: Cmd + Shift + F
- Search files in explorer (with include condition): Cmd + Shift + J (ex. search only from *.js)
Multi-Cursor (see):
- Cmt + d: select the same text (repeat Cmd + d to inc # of selected text)
- Cmt + Shift + L: select all the same text
- Option + Click to create cursor in any position
Terminals (ref)
- ⌥⌘← Focus Previous Pane
- ⌥⌘→ Focus Next Pane
- ⌃⌘← Resize Pane Left
- ⌃⌘→ Resize Pane Right
- ⌃⌘↑ Resize Pane Up
- ⌃⌘↓ Resize Pane Down
Multi-line actions
- comment out with // or #: select lines -> Cmd + /

How to change keybindings (Shortcut)

Open Command Panel with Shift + Cmd + P then type shortcut and select Preference: Open Keyboard Shortcuts

Commands (Shift+Cmd+P)

Reload Window: Reload Window
Screencast Mode: Toogle Screencast Mode

Debug UI

Add Break point
Send Request

VS Code on WSL

Install npm

You need npm to start with VS Code on WLS. For npm installation, see this

sudo apt-get update
sudo apt-get upgrade
sudo apt-get install build-essential
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.0/install.sh | bash

.zshrcに次を追加

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm

Install Node.js

# Now you can install the latest the latest LTS version of node:
nvm install --lts
# so next time you'll login to ubuntu you'll need to run the command:
nvm use --lts
# You can also add this command to the end of your .bash_profile file:
echo "nvm use --lts" >> ~/.zshrc

yokawasa/vscode-configuration.md