Markdown headings not appearing in outline box in VS Code - visual-studio-code

While editing a markdown document in VS Code, the outline box does not show me the outline of the markdown document; it's completely blank/empty. I've disabled all extensions with no change in behavior (and I only had one markdown-related extension anyway, markdownlint). I don't know that this has ever worked, but it certainly has not for the last several months.
OS: Mac OS 12.3
VS Code: 1.65.2

Out of the box, Markdown headings should show up in the outline view as text nodes:
If the outline view is configured not to show strings, Markdown headers won't appear.
Take a look at the Outline: Show Strings setting in your preferences and make sure it's enabled.
This setting is called outline.showStrings. If you wish to enable it only for Markdown files, you should be able to disable the feature globally and then add something like this to your settings.json:
"[markdown]": {
"outline.showStrings": true
},
It's probably easiest to start by running Preferences: Configure Language Specific Settings... in the command palette and then selecting Markdown.

Related

How do I recognize the extension that has taken over markdown editing

I suddenly find that my markdown files are being opened by a wysiwyg editor with chinese menus. No language is detected and searching through my extensions gave no hint. How do I figure out which extension is active?
In general, there is a command called "Developer: Show Running Extensions" that you can activate from the command palette.
In this case, I see a weird spelling in that screenshot: "Vditor".
Searching for that word finds a few pages, including one whose title is "vditor VS vscode-markdown-editor". From that page, I found Vanessa219/vditor.
That project claims to be
An In-browser Markdown editor, support WYSIWYG (Rich Text), Instant Rendering (Typora-like) and Split View modes
but not a Visual Studio Code plugin.
However, the extension vscode all markdown says it is "powered by" Vditor. I suspect you'll find that's the plugin to disable.
There is also something called vscode-office. It uses Vditor for Markdown out of the box, but this can be disabled:
It change markdown editor as vditor, it's WYSIWYG editor for markdown...
if you want using vscode editor, insert below json to vscode config.
"workbench.editorAssociations": [{
"viewType": "default",
"filenamePattern": "*.md"
}]

How to hide keywords from rust-analyzer autocomplete?

I'm using rust-analyzer 0.2.654 (latest) on VS Code 1.57.1 (also latest) on Windows 10.
The autocomplete displays all keywords, as shown below:
How can I hide the keywords, displaying only the actual struct members?
You can disable this in the settings UI by navigating to Text Editor > Suggestions > Show Keywords:
Or alternatively disable it via settings.json by including:
"editor.suggest.showKeywords": false,
You also need to disable "Postfix completions" otherwise you get a load of completions like dbg, match and so on which are really automatic snippets rather than actual struct members.

Stop vscode preview from scrolling

Is it possible to stop vscode preview from scrolling, while editing in another tab?
I have a preview open in a splitview, and when I scroll in the document the preview is also scrolling.
Yes you can for markdown. With other languages it would be dependent upon the extension support for that given language.
Markdown you can modify the following settings to make each interdependent of each other:
JSON of each would be:
"markdown.preview.scrollEditorWithPreview": true/false
"markdown.preview.scrollPreviewWithEditor": true/false

Is it possible to create an extension to vscode that changes the CSS of the editor?

I wish to develop an open-source WYSIWYG editor for markdown in vscode.
See the image below. I want an extension that can do something like that.
Change font-sizes for lines for titles.
Change lines indentation for subtitles.
I'm looking at the extension reference: https://code.visualstudio.com/api/references/vscode-api and don't see something that can help.
Do you have an idea how to change the CSS of the editor based on rules? in addition, If you have a link to extension that did it may help.
In other words: How a vscode extension can change css style of the editor window?
You can't change arbitrary css in the editor. See the extension guide for info about the VS Code extension philosophy and how you can extend VS Code
Two options:
Use the decorations api to change rendering of tokens in the editor.
Use a webview to implement a custom view (but don't try re-implementing a text-editor because it will be a pain and will not work like VS Code's normal editors do)

How to set up a minimap in VS Code?

I want to get an overview of my code and would like to use a minimap in VS Code.
I did not find an option to set this up in the menus. I am using VS Code 1.9.
Starting with version 1.10 (Feb 2017) vscode supports minimaps.
You can switch this function on via the preferences. Just follow these steps:
open vscode
File
Preferences
Settings
On the right pane you see your own custom settings. There you can add the following settings:
// Controls if the minimap is shown
"editor.minimap.enabled": true,
If this is the first setting you need to surround this with curly brackets and remove the tailing comme. If you have already one or more please keep in mind this is JSON so you need to separate key:values with a comma.
Adding the following to settings.json will also highlight where you are on the map:
"editor.minimap.showSlider": "always"
Additionally, to render blocks instead of characters for better visualization in the Minimap:
"editor.minimap.renderCharacters":false
You have to update to version 1.10+ and add "editor.minimap.enabled": true to your user or workspace settings, which can be opened with Ctrl+,.
Since the questions is "how to configure it" I will give what I've found is the most useful configuration of the minimap feature.
This is how it looks in my editor:
This is effectively about 1/3 height and only the first 40 columns. But still just readable. It makes it so I can quickly grab the minimap slider and scrub through a file.
Here is my minimap config:
In current VS Code versions, you can simply enable and disable minimap under view->Show minimap.This is reference from Visual studio code version 1.55.2. This way we don't need to edit json settings file.