Visual Studio Code (VSCode): The Dump

Visual Studio Code (VSCode): The Dump

Markdown Tips in VSCode

Interlinking Markdown Documents

Anchors from headings are automaticaly created. Just type ###### Some subhead
In the same file, we can link with just [go to](#some-subhead). Notice that we lowercased and replaces spaces with dashes.

To link to other files, easiest way is to drag-drop file and hold Shift key. That will produce something [like this]( We can also link to line numbers like [file](file#L60)

Link to folder [like this](Folder) possible also and it would open folder in Explorer bar, something like “Reveal In SideBar” but for folders.

Also try Find File References option on mouse right-click that will find us any mention of that file. Amazing!

Mostly from this source and here

Remote editing

This is common Visual Studio Code problem for Remote SSH editing.

Warning: inotify watchers?

This is a part of inotify filesystem options. A sensible setting is typically 100000 or more on a development machine and Ubuntu’s default of 8K is way too little.

Retrieve the current amount:

sysctl fs.inotify
# or: cat /proc/sys/fs/inotify/max_user_watches

Retrieve a number of opened files for the user:

lsof | grep inotify | wc -l

We can increase the values like this

sysctl -n -w fs.inotify.max_user_watches=1048576
sysctl -n -w fs.inotify.max_user_instances=512

But to make it permanent, it must being added to /etc/sysctl.conf:

echo fs.inotify.max_user_watches=1048576 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p


PHP in VSCode

Setup VS Code for Efficient PHP development 🚀 | Theodo Getting VSCode ready for PHP development - North Creation Agency


Annoyance Fix: Remove Extra Space on Top When Searching With CTRL+F

search inside file scroll to top space; ctrl-f; find in file space

The annoyance is that editor has an extra space on the top, that is possible to scroll to, when opening find/replace panel, for example using Ctrl+F.

Discussion and a solution is here: Editor area has an extra space on the top when opening find/replace panel

There is a settings option now:

"editor.find.addExtraSpaceOnTop": false,

Markdown Footnotes Preview

Extension: Markdown Footnotes

Here’s a simple footnote,1 and here’s a longer one.2

Visual Studio Code - YouTube

Images in VSCode

WOOW Luna Paint is an image editor inside VS Code that supports png, bmp, jpg, and newly added ico support.

It uses WebGL, so is very performant and

  • VS Code native, built on WebGL for perfmance,
  • Formats supported: .bmp, .ico, .jpg, .png, .tga, .webp.
  • Import from clipboard,
  • supports Hot Exit, which means if you close VS Code without saving it will restore unsaved changes, but for small images only
  • Remote support: Edit images remotely in a GitHub Codespace or via the Remote WSL, SSH and Containers extensions.
  • Web support: The extension works in and github.

Renaming files inside VSCode

Inline renaming files in Expolorer View inside VSCode is easily done with F2 shortcut.

Ja sam čest korisnik fenomenalnog Total Commander-a, pa sam navikao na shortcut Shift-F6 za tu istu funkciju Inline file rename. Da bi sa tim istim shortcutom nastavio i u VSCode, treba podešavatiPreferences: Keyboard Shortcuts.

Default F6 Shift-F6 are actions “View: Focus Next Part” and “View: Focus Previous Part”, što znači navigate across the workbench parts, u redosledu focusa Editor > Status Bar > Side Bar > Panela ako neki od njih is not visible neće ga ni prikazati. Meni to za sada nije nimalo korisno, pa ću ga za zadovoljstvom remapirati.

Renaming files within VSCode

You can always easily rename files within the Explorer View in VSCode using the F2 shortcut, but as a frequent user of the phenomenal Total Commander, I am accustomed to the Shift-F6 shortcut for inline file renaming. To continue using that same shortcut in VSCode, I must adjust the Preferences: Keyboard Shortcuts.

The default F6 and Shift-F6 actions are “View: Focus Next Part” and “View: Focus Previous Part”, which means navigating across the workbench parts in the focus order of Editor > Status Bar > Side Bar > Panel. If any of these parts are not visible, it will not be displayed. For now, this is not particularly useful for me, so I’ll happily remap it.

On Keyboard Shortcuts

VSCode Extensions

VSCode Extension: Markdown Improvements

Markdown Preview Enhanced je sve u jednom za preview sa 3.8M korisnika. Markdown All in One - Visual Studio Marketplace sa 5.6M usera

Markdown Preview Github Styling

GitHub Markdown Preview je takođe GitHub a ustvari komplet potrebnih extenzija.

Marp for VS Code - Visual Studio Marketplace

Markdown Editing Helpers

Reformat Table

Markdown Table Prettifier - Visual Studio Marketplace za edit, ne za preview je super Table Formatter - Visual Studio Marketplace

Paste Image

Paste Image Markdown Paste - Visual Studio Marketplace Markdown Image - Visual Studio Marketplace

Extended Language Features

Markdown Footnotes - Visual Studio Marketplace Markdown Checkboxes Markdown Preview Mermaid Support diagram and flowchart Markdown Emoji Markdown Preview VS Code Highlighting syntax highlightning for markdown code blocks

Markdown yaml Preamble - Visual Studio Marketplace

Markmap - Visual Studio Marketplace Markdown Preview Markmap Support - Visual Studio Marketplace

VSCode Extension: PDF Viewer

Both run the latest pdf.js underneath.

VSCode Extension: Convert Markdown to HTML and PDF

Markdown Exporter

Markdown Converter - Visual Studio Marketplace Markdown Extended - Visual Studio Marketplace Export to Self Contained HTML / PDF / PNG / JPEG Markdown PDF has 1.4M users, zato što povlači ceo Chromium download, zaboravi na ovu extensiju.

markmap je markdown + mindmap i brz i lep Mermaid | Diagramming and charting tool je ludilo za dijagrame, a open-source je

Marp: Markdown Presentation Ecosystem za slajdove, open-source

Grammarly - Visual Studio Marketplace LTeX – LanguageTool grammar/spell checking - Visual Studio Marketplace jer je fork od onoga

Customizations I did in Visual Studio Code

I can’t remember the exact occasion, but I applied this in VSCode, probably to switch focus from editor to terminal on non-US layouts.

AI Fuzzy Find in Files

phonetic search across files, fuzzy full-text search, fuzzy find in files, phonetic matching, artificial-intelligence-based heuristic searching, ai powered document search, neural search, ai full-text search engines, natural language processing, ai powered document search

If you’re looking for better text search than literal or even phonetic (aka “fuzzy”), there may be hope on the horizon in the form of AI-driven search. People have been asking for it, such as Fuzzy find in files.

There are libraries such as jamesturk/jellyfish for doing approximate and phonetic matching of strings and even Emacs has something like Ivy/Swiper: abo-abo/swiper. But nothing for VSCode, unfortunately.

But it turns out that there are some solutions out there – most of them just not applied yet.

I’ve discovered spaCy, a free open-source library for Natural Language Processing in Python. It’s very robust and might be just what I’m looking for. There’s also a commercial product called Prodigy with already trained pipelines for English and Croatian.

A few people have mentioned it, but nothing material came out of it: Visual Studio Code integration?. I don’t have enough knowledge to really understand what they are talking about.

Too bad, there’s still nothing for VSCode or similar.

Go to File = Find File by name

search for files by name, quick open file, quickpick fuzzy search

Note that quick file finding by name in VSCode is fuzzy from the start, by default. Some people have complained about this and probably there is a room for improvements. People usually recommend switching to the fzf algorithm, and for that, there’s even an extension: Fuzzy Search.

It’s all good for me when it comes to quickly opening files in VSCode - but what I’m looking for is something else entirely.

Ako želim da dupliram fajlu i istom folderu, već duže vreme me nervira što moram prvo da uradim “Copy” pa zatim da idem na folder koji je obično malo scrollovanja, i tek onda radi “Paste” kako treba. Nekog lika je ista stvar nervirala: add right-click Duplicate to file explorer, pa je dobio savršen odgovor da možeš da držiš “Ctrl” i da onda draguješ fajl bilo gde, i on će biti kloniran. Savršeno!

A Smarter Way to Clone File

streamlined file duplication, effortlessly duplicate a file

To duplicate a file within the same folder, it can be frustrating to have to first perform a “Copy” action, navigate to the folder item which often requires a bit of scrolling, and then perform a “Paste” operation. Well, someone else shared the same frustration and proposed adding a right-click “Duplicate” option to the file explorer.

The solution? You can hold down “Ctrl” and then drag the file anywhere and it will be cloned. Elegant!

  1. This is the first footnote. ↩︎

  2. Here’s one with multiple paragraphs and code.

    Indent paragraphs to include them in the footnote.

    { my code }

    Add as many paragraphs as you like. ↩︎

date 06. Nov 2020 | modified 06. Feb 2023
filename: Tips » VSCode » Dump