Visual Studio Code Plugins
A few months back, I moved from a mobile engineering team to a fullstack web team.
As a result, I also moved from Xcode to Visual Studio Code, which has quickly become my general editor of choice.
One of the nicest parts of VS Code is how extensible it is, especially compared to the locked-down-to-a-fault Xcode.
I use a number of plugins, which I’ve documented here.
Table of Contents
Open Table of Contents
I’ve used vim keybindings in pretty much everything - including Xcode and VS Code - for close to a decade now.
In VS Code, I use the (very popular and polish) VSCodeVim plugin, which emulates vim’s modal editing in VS Code.
VSCodeVim has implemented a surprisingly large portion of vim’s default functionality, including smartcase, relative line numbers, and highlighted yanks,
as well as a number of plugins I rely on,
including commentary.vim, surround.vim, CamelCaseMotion, and sending yanks to the clipboard.
I’ve also started trying its sneak.vim mode, too!
In fact, just about the only plugin I (very occasionally) miss is vim-swap.
I previously used VSCode Neovim, which connects VS Code to a real Neovim instance with full plugin support.
However, there have always been a few annoying edge cases, like how Neovim visual selections aren’t mapped to VS Code selections, and a recent VS Code update started causing wild issues,
so I’ve switched back to the “safer” plugin for now.
I’ve been playing with Codeium recently, which is a free alternative to GitHub Copilot - a useful service,
but not one I was eager to pay $10 a month for, especially when Codeium is fairly competitive.
I like to think of these plugins as “advanced autocomplete” - type a comment or start writing some code and you’ll see an LLM-generated sugggestion, which are surprisingly useful,
like filling out the rest of a complicated JSON object or taking a first pass at a minor algorithm.
Am I concerned about the legal and ethical status of LLM-based code generation?
A bit, but I’m exclusively using this for my own open-source projects and mostly focused on small-scale edits,
which are either “obvious” but require some toil or would be a simple StackOverflow search away.
There’s also Sourcegraph Cody, which is likewise free, but I found its suggestions slow and less useful than Codeium or GitHub Copilot.
Markdown All in One
Markdown All in One adds a lot of handy Markdown editing features, like auto list continuation and standard hotkeys like Cmd-B for bold.
It makes VS Code almost as efficient as a real Markdown editor, though I still prefer Ulysses for heavy-duty editing and writing.
Fair warning: this plugin does clobber a few standard VS Code hotkeys, like Cmd-B to open the side panel. I had to move around a few hotkeys as a result.
Auto Rename Tag
This extension does exactly what it says on the tin - if you edit one half of an HTML or XML tag, it will automatically rename the paired tag. I think VS Code actually has this built-in now, but only for files with the HTML extension - Auto Rename Tag is perfectly happy operating on
.tsx files as well.
Copy File Name
Sometimes it’s useful to copy the name of the current file, like if I want to search for references to that file with
rg. Confoundingly, VS Code doesn’t seem to have a built-in hotkey hook for copying the file name.
Copy File Name remedies that.
Error Lens / Pretty TypeScript Errors
Error Lens is a massively popular extension that makes error highlighting and lint messages stand out more prominently. Pretty TypeScript Errors improves the readability of long TypeScript errors. Neither is strictly necessary, but both are small quality-of-life improvements.