Visual Studio Code/ VS Codium

Egg-laying wool milk text editor

2018-01-25 – 2020-07-03
Maybe related 🤷:

A code editor.

VS Code is Microsoft’s in-house competitor to Atom, with a similar technology stack, but somewhat cleaner and faster.

I am not clear on its relationship to the flabby Visual Studio. Some shared branding without any particular shared code? I don’t care enough to ever find out.1

Anyway, VS Code is OK, it turns out.

But actually VS Codium

VS Codium is the pure community distribution of VS Code. Despite the editor being mostly open, Microsoft inserts some creepy code into the packaged version which VS Codium excludes. Why and how you should migrate from Visual Studio Code to VSCodium

## Ubuntu-esque
wget -qO - https://gitlab.com/paulcarroty/vscodium-deb-rpm-repo/raw/master/pub.gpg \
  | sudo apt-key add -
echo 'deb https://gitlab.com/paulcarroty/vscodium-deb-rpm-repo/raw/repos/debs/ vscodium main' \
  | sudo tee --append /etc/apt/sources.list.d/vscodium.list
sudo apt update && sudo apt install codium
#Windows
choco install vscodium
# Mac
brew cask install vscodium

This should work more or less identically to Microsoft’s version, except that Microsoft will know less stuff about you.

Multiple Windows

This sorta works. tl;dr Use the command Duplicate workspace in new window.

Searching

Almost obvious but to get maximum value you have to learn a couple of extra things.

Multiline search expressions require you to type ⇧-⏎/Shift-Enter. That’s for vanilla string matching. For regex matching if you want to match multiline search you need to explicitly add newline characters to your character classes, i.e. [\s\S\r]+.

To replace regex groups you do the usual thing - $1 is the first group etc and $$ is a dollar sign. Putting this together, if you wished to replace latex equation bracket syntax with latex dollar syntax, you would replace

\\\[ *([\s\S\r]+?) *\\\]

with

$$$$$1$$$$

🤢

VS code does ordinary javascript regex. If you want fancy lookaround or backref you can enable the setting search.usePCRE2.

Multi cursors interact with search usefully. General multiple cursors are made by Alt+Click/ Option+click. There are many keyboard shortcuts to use them to automate menial chores.

python

Cursors, navigating, selection

There are many useful shortcuts for navigating/selecting. and you can add more obvs.

Shift Alt i inserts a cursor at the end of every line in the current selection

Ctrl/Command Alt Arrow to add cursor above, or down arrow to to add cursor below.

Ctrl+Shift+L is supposed to add a cursor at every occurrence of the current selected text, but it does not for me unless I am in search mode.

Ctrl Shift Arrow selects by word.

Ctrl Alt - moves cursor to where it was before.

F4/Shift F4 to navigate to global search results. F3 for local.

There is a port of vim-easymotion and various other useful vim-style navigation shortcuts

Bookmark navigation

Install the bookmarks extension. Default shortcuts Ctrl Alt K to book mark and Ctrl Alt J Ctrl Alt L to move between bookmarks. These shortcuts clash with a lot of other shortcuts, so one needs to hack the preferences.

Go to symbol doesn’t work

Go to definition? Go to symbol? idk; there are a lot of similar features here for code navigation It turns out go to symbol is somewhat broken generally, and totally arsed for python.

Important keyboard shortcuts

Tab switching is not obvious. There are a lot of tweaks you could do, but short story: Ctrl PageDown (Windows/Linux) or ⌘ ⌥ → (Mac).

Snippets

Roll your own snippets. You invoke them using Ctrl space <prefix> tab, where you get to define <prefix>. There is an example at vs code for prose.

LaTeX

See VS Code for LaTeX.

python

There is a python extension which is more or less mandatory since python is in so many things these days. The fancy new Pylance which adds non-trivial improvements like type checking.

ext install ms-python.python
ext install ms-python.vscode-pylance

Misc needful extensions

emoji and unicode

Insert Unicode is a handy tool for inserting arbitrary unicode by searching in various elaborate ways, including full emoji support. Alternatively, Unicode Latex converts from LaTeX character macros to unicode.

“Remote” editing

Remote edits code in particular environments - including spinning up containers or SSH sessions, so that your editor and execution environments can be different. The remotes in the former case can be local “remotes”. This is a smooth networked edit workflow, although the remote vs_code can be lacking some needful extensions. I should work out how that works.

Slightly weirder, code-server runs a server process that makes vs code accessible to you in a browser. The companion app ssh automates that. I am not sure when you would do it this way. Some kind of devops scenario that I am not cool enough to know about, or when working from a thin client?

Editing prose

See VS Code for prose.

Settings sync

But you can coordinate across machines using settings sync.

I don’t want to sync everything, I can use sync pragmas, which look like this:

// @sync os=linux host=work-pc
// @sync os=mac host=home-pc

Various config one needs

You config is in a JSON file, which is quaintly retro but does mean that 3rd party config is at least not purely abysmal. The location is the following:

  • Windows %APPDATA%\Code\User\settings.json
  • Mac ~/Library/Application Support/Code/User/settings.json
  • Linux ~/.config/Code/User/settings.json

But you can coordinate across OSes by using settings sync.

Hover/tooltip/hint/autocompletion things are too intrusive

There are a lot of features which huddle under the opaque umbrella of intellisense, because they let someone in marketing get too near the product. But they all need tweaking, so you have to work out which is which. First, which is hover, which is hints etc?

The thing that appears when you mouse over a character is hover. It probably does something useful in statically-typed languages, but often ends up just being annoying in, e.g. javascript/python.

To clam it for all languages, perhaps

  "editor.hover.delay": 3000,

so it activates after 3 seconds instead of RIGHT NOW LOOK AT ME OH SORRY WERE YOU TRYING TO READ SOMETHING ON THE SCREEN.

Possibly also

  "editor.hover.sticky": false,

The hints are probably also being annoying, right? because instead of letting you finish a line it wants to to insert some wacky argument?

  "editor.acceptSuggestionOnEnter": false,

That can be toned down by language for e.g. markdown.

How about bracket closing? (brrrrr) If you are like me and you are offended by every implementation of bracket closing you have yet seen, you want, in your config:

  "editor.autoClosingBrackets": false,

Aaaaahhhh that’s better.

Alternatively, you might want to use AI-assisted IntelliSense.

Outline view in python is mostly imports

If you are using the (deprecated) code outline extension, Alex Gvozden’s solution:

    "symbolOutline.topLevel": [
        "Class",
        "Module",
        "Constructor",
        "Function",
        "Method"
    ]

AFAICT the built-in one doesn’t do this.

Which language is that file?

Want to associate file types to certain languages?

    "files.associations": {
        "*.jsx": "javascript",
        "*.rst": "restructuredtext",
        "*.Rmd": "markdown",
        "*.Rpres": "markdown",
        "*.Rnw": "latex",
        "*.jmd": "markdown"
    },

Privacy

Want to disable reporting your habits to Microsoft?

    "telemetry.enableTelemetry": false

Jupyter

You can use VS Code as an alternative client to talk to jupyter kernels.

The extension to use here is VS code Juptyer. Check its nifty examples.

Bonus gotchas

Command line not working

You want it to work from the command line for fish shell on macOS?

set -U fish_user_paths \
    "/Applications/Visual Studio Code.app/Contents/Resources/app/bin" \
    $fish_user_paths

  1. “Flabby” in the sense of being busy with features I don’t want, not in the sense of wasting hard disk space or RAM. As a javascript desktop app, VS Code is a gigantic memory waster, like all the other javascript apps.↩︎