How to customize the touch bar in visual studio code?

You could check out the Nasc VSCode Touchbar extension

It allows you to choose from a bunch of preset commands by updating your settings.json to toggle buttons on/off

There are some other extensions you can try out that have come out since time of this post's publishing: https://marketplace.visualstudio.com/search?term=touchbar&target=VSCode&category=All%20categories&sortBy=Relevance

eg

{
    nasc-touchbar.goToDefinition: true,
    nasc-touchbar.goToNext: false,
    // ..etc
}

And if you're game you can write your own.

I kept running into this issue as well and it was quite frustrating. I appreciate the ability to customize via an extension, but I really like the drag-and-drop mechanism provided universally (or nearly) that is missing here.

As a result, I ended up disabling the touch bar within VS Code by going to:

Code -> Preferences -> Settings

and then:

Application -> Keyboard

There you will find the checkbox for enabling/disabling the touch bar on macOS. Hope this helps someone else discover it quickly!

I just ended up making it always show function keys:

https://support.apple.com/en-us/HT207240

Effectively:

System Preferences -> Keyboard -> Shortcuts Tab

At the bottom of the left pane, you will see Function Keys select that. On the right hand side you can +/- apps you want to always show the function keys.