Problem (Markdown)
When I have any kind of list, every list item after the first is being tabbed for no reason.
Currently on save
- [Dashboard](#dashboard)
- [Table of Contents](#table-of-contents)
- [Running as a developer](#running-as-a-developer)
- [Data Tab](#data-tab)
- [Disclaimer](#disclaimer)
Desired result on save
- [Dashboard](#dashboard)
- [Table of Contents](#table-of-contents)
- [Running as a developer](#running-as-a-developer)
- [Data Tab](#data-tab)
- [Disclaimer](#disclaimer)
How can I fix this within VS Code?
Tried:
Change Prettier tab width
Format document with another formatter like "Markdown All in one"
Prettier Configuration
VS Code Extension: Prettier - Code formatter(esbenp.prettier-vscode)
I found the problem. There is nothing wrong with prettier.
The issue was that in my markdown file this is how my headers were :
# Dashboard
## ...
## ...
For the table of contents ... major sections must have the same amount of '#'. That's why prettier kept tabbing the rest. (more hashtags mean subsections)
So originally, I set it up such that everything is a subsection of "Dashboard".
Fix:
## Dashboard
## ...
## ...
Related
The current behavior as follow:
- List item 1
- List item 1.1 that span over
multiple line
- List item 2
I want it to look like this:
- List item 1
- List item 1.1 that span over
multiple lines
- List item 2
The main reason I want to improve this is readability. I already searched everywhere and couldn't find an answer to that, I hope someone will be able to help me, if it's even possible.
I tried to search in google and looked at the settings of visual studio code but I couldn't find any solution. Referring to the textMateRules didn't help as well.
I found a solution; adding the following lines to the settings.json file will change the wrapping indent to what I described above.
"[markdown]": {
"editor.tabSize": 1,
"editor.wrappingIndent": "deepIndent"
}
I am using VSCode extension prettier to format my code .But when I format it I want that highlighted part comes in a single row instead of multiple rows.
(All settings are default except prettier.printWidth :3000 it was prettier.printWidth:80 by default)
Screenshot 👇
When editing or creating markdown files inserting of updating the table of contents will substitute the word auto for new line characters between the TOC tags. Such as:
<!-- TOC fromDepth:2 ToDepth:4 insertAnchor:true -->autoauto- [1. Introduction](#1-introduction)auto- [2. Section](#2-section)auto - [2.1. Sub Section One](#21-sub-section-one)auto - [2.2. Sub Section Two](#22-sub-section-two)auto - [2.3. Sub Section Three](#23-sub-section-three)autoauto<!-- /TOC -->
I am using VS Code and MarkdownTOC. Any suggestions on what may be going on with this.
This issue is being discussed here
It seems that the issue was introduced by a change in VSCode 1.29.0.
There are two workarounds for solving this:
1. Setting eol back to \n in VSCode settings.
2. Manually replace all ocurrences of auto with \n (be careful not to break your content)
I used the Vue cli to create a project and it uses 2 spaces by default. I want to get 4 spaces. I've turned off detect indentation, set tab size to 4 but no amount of running format document will change - for example - this little js file that was created.
I also tried to change things with eslint. It spots the errors but --fix has no effect
If I start a new object then the spaces are correct though.
I am using an extension called Vetur and in my VS Code settings file I added the following rule: "vetur.format.options.tabSize": 4,
Also for initial indentation I have added the following rules:
"vetur.format.styleInitialIndent": true,
"vetur.format.scriptInitialIndent": true,
If you are not using this extension, do you have a .editorconfig file in your solution and/or have you looked at your VS Code settings for conflicting rules?
I created a language extension for Visual Studio Code and I would like to change the comment block characters, but I couldn't find a way to do so..
How can I do it?
OK, I finally figured out what the problem was.
There are two ways you can change the comment blocks:
1. Configuration file
I don’t know why it's not in the documentation (or at least I couldn't find it), but there is an optional property you pass to the object inside the contributes.languages array in the package.json file named configuration.
The description found on the Visual Studio Code source code:
A relative path to a file containing configuration options for the
language.
In those files you can create an object like this one and it's going to overwrite the default comment characters
{
"comments": {
"lineComment": "//",
"blockComment": [ "<!--", "-->" ]
}
}
You can see this properties on the API references: CommentRule
Note: That comment block command is triggered with a different shortcut. You can overwrite it though (in a general or even for a specific language using the property when on the key binding object).
⇧⌥A - Toggle Block Comment - editor.action.blockComment
Key Bindings for Visual Studio Code
2. "Syntax" file .tmLanguage
Yes, you can do it from there too and you can make it even better.
You can see an example on vscode-handlebars/syntaxes/handlebars.tmLanguage.
Try deleting the Babel extension if you are using the Visual Studio Code editor. It worked for me.