Emmet abbreviations are routinely getting in my way when writing jsx/tsx code, popping up and taking precedence over methods or other completions I actually want. For instance, in this screenshot the Emmet abbreviation is getting in the way of auto-completing the replace method on a string:
This happens surprisingly frequently.
I don't currently use Emmet. Is there any way to turn them off entirely, or at least in .js, .jsx, .ts, and .tsx files? I've kicked around the settings a fair bit and while there are lots of Emmet-related options, I can't find a simple off switch! :-)
You can turn emmet off in suggestions completely with:
{
"emmet.showExpandedAbbreviation": "never"
}
You can turn emmet off by language with:
"emmet.excludeLanguages": [
"typescriptreact", "javascriptreact"
],
Related
I am getting annoyed by the autocompletion of the <> brackets in VSCode for Rust. While it might be useful when specifying generic types, it really bothers me when it autocompletes ">" for my smaller than operators.
I know I can disable autoclosing brackets completely, but is there a way to specify which of them should be considered brackets? I have installed the Rust extension, and without it, this is not a problem.
Angular brackets were added to autoClosingPairs in this pull request on the premise that Rust developers write generics more than comparison logic. This choice was re-discussed here tp no avail. It seems that there is no way to differentiate between generics and comparisons with vscode's current configuration options. However, there are two ways to remove this behaviour manually. One is to disable auto closing for all brackets by adding this line to your settings.json:
"editor.autoClosingBrackets": "never"
The other solution is to disable autoclosing for only angular brackets by removing the rust extension's configuration locally:
// .vscode/extensions/rust-lang.rust-x.x.x/language-configuration.json
"autoClosingPairs": [
{ "open": "<", "close": ">" },
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ remove this line
]
I got a VSCode JSLint extension and I got its settings pointing to an .eslintrc file where I have the following specified for indentation:
{
...
"indent" : [1, "tab"]
...
}
The problem is, it's still putting the squiggly green lines where I have some tabs and I can't tell where anything's going wrong with any settings.
I have evidence the rc file is actually working because I was successfully able to change it from single to double-quotes. However it appears to completely ignore the indentation setting inside my VSCode.
You could simply disable the use_spaces rule. It's separate from the indent rule you changed. A bit over an oversight from JSLint.
There were quite a few complains about that rule, even here on SO. Quite a few people (not only on SO) suggest switching to JSHint instead. Personally I've only used ESLint and therefore don't know much about the differences, and I'd suggest checking those for yourself anyway.
So when I type in an emmet abbreviation like div.result which should then expand to <div className='result'></div>. However, with Intellisense, VS Code detects that I have a filename called MovieResults, and suggests it.
I hit esc because then otherwise, my emmet abbreviation turns into <div className='MovieResult'></div>.
The suggestion goes away, but from there, I don't know of any other way to expand the abbreviation, other than setting "emmet.triggerExpansionOnTab": true.
Any ideas on a solution to this? It's just bugging me that I'm trying to name the className as results, but Emmet isn't offering me an autocompletion for it.
Here are some images of what I'm talking about:
In my case I had changed to:
"emmet.showExpandedAbbreviation": "inMarkupAndStylesheetFilesOnly",
changing back to the default fixed the issue:
"emmet.showExpandedAbbreviation": "always"
Also this will help:
"emmet.showSuggestionsAsSnippets": true,
"editor.snippetSuggestions": "top",
I'm editing a stand-alone JavaScript file in VSCode 1.19.2. I do not have a project set up, and no jsconfig.json to control it.
I enter the following code into an empty editor:
var scene = new THREE
Intellisense starts to kick in and gives an auto-complete list.
When I press "." (expecting my code to become THREE.), IntelliSense takes this as a sign that it gave me the right answer, and changes my code to:
var scene = new HTMLHRElement.
The full string "THREE" wasn't even in the list, but IntelliSense seems to be using some kooky regular expression to predict what the user actually tried to type--the letters are all there in the applied symbol, but they're all split up and in different cases.
For me, this is counter-intuitive (not to mention frustrating beyond words, because I type this string a lot), but everything I've found so far is people asking for this feature. So, I'm looking for a work-around for me.
Is there any way to turn off "complete on dot," or maybe a similar setting to force IntelliSense autocomplete only on tab? Also feel free to correct my terminology, in case that was preventing me from finding the correct answer.
JavaScript and TypeScript treat . as accepting the current suggestion by default. You can disable this by setting:
"editor.acceptSuggestionOnCommitCharacter": false
or, if you only want them disabled in js:
"[javascript]": {
"editor.acceptSuggestionOnCommitCharacter": false
}
I'm using Visual Studio Code 1.14 on MacOS and have tried creating my own keybinding that re-indents only the lines of code that I've highlighted.
I have this in keybindings.json:
[
{
"key": "alt+cmd+[", "command": "editor.action.reindentlines",
"when": "editorHasSelection && editorTextFocus"
}
]
I chose the commands for the "when": clause based on this article.
The Problem: When I use my custom keyboard shortcut, it re-indents the entire page instead of only the text I've selected.
It's petty, perhaps, but this can cause a formatting nightmare, such as when writing a ReactJS app where VSC's regex pattern for detecting how to indent lines seems to get confused when looking at a mix of javascript and html within a .jsx file. In such cases I only want to re-indent/auto-indent the text I choose - not the entire page.
How can I get the keybinding to function with the behavior I'm looking for?
The when-clause can only change when the command is active - not how it behaves. The issue is that the implementation of the command operates on the whole file, rather than the current selection.
I don't think reindentation of a selection is supported yet, but it seems to be on the roadmap. For instance, it was mentioned in #19847 (emphasis mine):
The reason that right now we don't support Reindent in ranges is that we have some issues with boundaries in embedded-language files. Some of them are just TextMate Grammar issues but I'm sure if that can fix all. Once that issue is addressed, I think it's easy to support reindent in ranges/selection. And then Reindent when paste/moveLines/etc.
Thanks to #Gama11 for pointing me to this github issue.
The solution that accomplishes what I was trying to do is to use the command editor.action.formatSelection instead of editor.action.redindentlines.
As shown by Gama11, reindent in ranges isn't currently supported, however Format Selection is a very similar command that uses different logic to accomplish indentation within a certain range.