Visual Studio Code auto indent in JSX - visual-studio-code

Let's say I have this code in .jsx file:
Now if I type, for example, BrowserRouter and hit Tab I got this state which is still ok:
But now when I hit Enter, I have this state:
How do I make it work like in .html files that pressing Enter adds two new lines and makes auto indentation? Like that:
I have VS Code v1.20.1 and my preferences which could be related to this issue are as follows:
"emmet.triggerExpansionOnTab": true,
"emmet.includeLanguages": {
"javascript": "javascriptreact"
}
I've searched through Github issues of VS Code and seems like it was fixed about half a year ago and should work now, but for some reason it's not. Also I've run VS Code with --disable-extensions flag for this so it's not an extension problem.
I've also found that it seems not to work for top-level tag only. For anything inside it the indentation works like in .html files. Strange.
Thank you.

Related

Why "markdown.styles": [] setting disappeared in VS Code?

I could not find this setting by searching for "markdown styles" in the Settings page.
I am wondering if I lost the VS Code built-in markdown extension. Please see the image below, which shows what my search should've returned.
When I tried to add this setting to the settings.json file (another way to set the markdown style), "Unknown Configuration Setting" showed up as I hovered on it.
Unknown Configuration Setting:
I have tried resetting the settings.json file, reinstalled any relevant markdown extensions and even reinstalled VS Code, but it is still not working.

How to display the "abc" suggestions on my VS Code extension?

Normally, VS Code displays abc suggestions like the one below in the editor:
However, the VS Code extension that I have created does not display these word suggestions for my files, which have a different different file extension (e.g. myFile.mf). In the .vscode directory of my extension, I opened settings.json, and added the line below:
{
"editor.wordBasedSuggestions": true
}
This change was not successful, so I tried doing what was suggested in the answers of this Stack Overflow question, but to no avail. I have also tried closing and reopening VS Code after making the changes, but the abc suggestions still won't appear. What should I do?

vscode "applying code action organize Imports"

Currently got an annoying issue with VS and saving ts files.
every time I save a ts file I get a little popup in the bottom right telling me its "applying code action organize Imports".
I've tried uninstalled VSCode, removing all extensions, deleting the code folder in Roaming. As far as I can tell all my user settings are blank and it should be back to a clean install of VSCode. I've tried looking in the settings for something similar, even adding this to my settings.
{
"editor.codeActionsOnSave": {
"source.organizeImports": false
}
}
However, I'm still getting the same message on save and its restructuring the imports.
I've got vs code installed on another 2 machines and don't get the same issue.
Any ideas?
Turns out the folder I was opening had its own custom .vscode folder with its own settings.json which had the organizeImports setting enabled. So no matter what I did to my local settings file this one was always overriding it and nothing was showing up within VS directly.
I had forgotten to select a Python interpreter in vscode. Once I did this, the pop up on bottom right telling saying its "applying code action organize Imports" stopped appearing. This solved it for me.

Visual Studio Code doesn't insert snippet

I have installed Reactjs code snippets code snippet extension.
Snippets used to work Until I installed PHP Storm Keymap extension.
In a JSX (or JS) file when I try to add snippet the editor converts it to a tag instead of completing the snippet. ( It will convert rcc to <rcc></rcc> instead of completing snippet.)
I checked my Keyboard Shortcuts both, exmpandAbbreviation and insertSnippet are set on tab I tested changing insertSnippet to other keybinding but it still doesn't work.
Any thoughts?
Apparently adding
"editor.tabCompletion": true
to settings.json solves the problem.
I went to my setting.json file and had to delete this line
"editor.snippetSuggestions": "none",
and that worked.

VS Code turns everything into an html snippet?

a serious limitation for my workflow with vs code is the fact that while typing html everything gets turned into an html tag when pressing tab at the beginning of a line.
entering:
alsdjflkasjdfk + Tab
leads to:
<alsdjflkasjdfk> </alsdjflkasjdfk>
this is a problem since I want to integrate Django html snipptes and they end up not working. Does someone know how to turn this off? I rather just want defined HTML Snipptes than simply everything turning into one.
Try setting:
"emmet.triggerExpansionOnTab": false
This should disable this feature. We are also investigating a different flow for emmet with VSCode 1.12: https://github.com/Microsoft/vscode/issues/21943