Harry Khanna
Khanna Law
Note type

Visual Studio Code

Personal Usage Notes

When I've been using an IDE and haven't needed to set up a new machine for a while, I often forget many of the decisions I made and the reasons for them. If I step away from programming for too long, I can also forget some of the most helpful keybindings.

This note documents many of those decisions and keybindings so I have an easy refresher when I want it. I mostly work in Python and Javascript.

Keybinding Refresher

I use vscode-vim.

y s <motion> <desired> - Add desired surround around text defined by <motion>.
d s <existing> - Delete existing surround
c s <existing> <desired> - Change existing surround to desired
S <desired> - Surround when in visual modes (surrounds full selection)
t or < as <desired> or <existing> will enter tag entry mode. 
Using <CR> instead of > to finish changing a tag will preserve any existing attributes.

g c c - Comment out line
g C [text obj] - Comment out text object, e.g., gCi) comments out everything in parenthesis

s _ _ - sneak forward
S _ _ - sneak backward
<operator> z _ _ - Perform <operator> forward
<operator> Z _ _  - Perform <operator> backward

Text Objects
<operator> i i - indentation level text object
<operator> a i - indentation level text object + line above (for python)

Other Tricks
g d - Jump to definition
g q - reflow and wordwrap blocks of text. Great for formatting comments
g h - equivalent to hovering your mouse over where the cursor is

Workspace vs User Settings

Formatters for both python and javascript are in workspace-specific settings. This is because the idiosyncrasies of semicolons etc should be consistent from project to project.

For python, we don't have a linter per se. pylint has a limited featureset, so I installed the Pylance extension which is a Microsoft-sponsored new language server for python. It seems to include linting. This is in my user settings.

Eslint should conceptually be in user settings but the executable has to live somewhere, which would be the node_modules of the project, so we keep the javascript linter settings in the project settings. There's also some interaction with prettier has to be handled, so the best place for it all is the project settings.

prettier configuration goes in package.json, although we could put it in like a .prettierrc file if we wanted. There's also a .pretterignore file we need for .next. Eslint config goes in .eslintrc.

Pytest vs Django Test Runner

The only reason we're using pytest over the default Django test runner is VSCode does not have support for the latter, which makes it painful to debug tests. We should continue to write the tests in the Django test runner form though since pytest handles it fine and if VSCode ever supports the Django test runner, we can remove pytest without rewriting any tests.

Devcontainers and WSL

  • From inside WSL 2, in any repo directory, you can type code . to boot up into a VS Code with remote to WSL capabilities.
  • If you want to do docker stuff, execute "Reopen in Container"
  • For some repos, you'll want to attach to existing docker-compose containers. For other repos, you might use the Dockerfile or create new containers from scratch.
  • However you do it, when you're up and running in the container, you'll need to manually install all the extensions into the container.
  • Note that git push/pull will not work properly in devcontainers. I can't get ssh-agent to work properly. Related issue