VS Code -- commenting .jsx syntax - visual-studio-code

I checked previous questions on SO here and here and VS Code's issues here and here.
I still don't know how I can comment jsx syntax in VS Code by cmd + /. I tried syntax JavaScript React and JavaScript Babel and add:
"files.associations": {
"*.js": "javascriptreact"
},
into user settings. Nothing helped. When I check Developer Tools, there are no error messages.
recording

If you have Babel ES6/ES7 plugin installed, disable it. Editor comments .jsx syntax by // instead of {/*. You see see the issue here.

It works for me, Remember Atom has this behavior, but VSCode looks a bit intelligent around this area.
I have no custom file associations defined. Also I am on the latest version of VsCode. Make sure you have no additional addins that takeover and change the behavior

Related

VSCode Syntax Highlighting for Javascript doesn't work

i got a little problem over here and i don't get why. My Syntax Highlighting doesn't work on a normal .js file whilst i've Babel Javascript & the Atom One Pro Theme activated as extensions. Don't get whats going wrong here.
picture of the code how it looks right now
Try the Template Literals plugin from the visual studio marketplace. Refer to the below blog for the exact reason.
Reference:
https://medium.com/#julienetienne/javascript-the-need-for-template-literal-highlighting-ff5806adc814

Turning off misidentified "Experimental decorators" linting errors in cshtml/Razor template files (VSCode)

I have a legacy system that uses Razor templating.
When I open *.cshtml files in VSCode, I get linting errors reported in VSCode even though it's ultimately valid JavaScript.
Here's an easy example: Whatever linter it is complains I'm using "experimental decorators". I'm not.
Experimental support for decorators is a feature that is subject to change in a future release.
Set the 'experimentalDecorators' option in your 'tsconfig' or 'jsconfig' to remove this warning.`
It's a Razor comment, which is completely legit here:
#* If MathJax wasn't successfully loaded from cdn1, use the second: *#
I have eslint installed. I use that to lint "real" JavaScript files. That, with the VSCode eslint extension, works perfectly. And I don't mind having JavaScript linting in html, but whatever's running doesn't seem to be eslint.
I tried essentially following the instructions in the error & creating a jsconfig.json file with an ignore in it, but this did not seem to work either.
{
"compilerOptions": {
"target": "es6"
},
"exclude": ["**/*.cshtml"]
}
Perhaps I borked the glob? (I tried a few -- just *.cshtml, ./**/*.cshtml).
At any rate, I have no idea what's doing this linting. I searched my settings file (in raw JSON) for javascript and js and didn't find an obvious culprit there.
What linter is this? How do I make it cshtml aware? Or how do I turn linting off for *cshtml (and in this way, at least, my question is different than this question) completely?
Answering my own question for now with a workaround/less than perfect solution...
Looks like the setting to kill it is:
"html.validate.scripts": false,
I would still prefer to have scripts validated in a Razor template-aware way.
How to edit settings directly
Add this text to settings by...
Typing ctrl-p (cmd-p on macOS),
Typing JSON, and
Selecting Preferences: Open Settings (JSON).
Paste the snippet into the file that was opened.
Note: These reported errors may have been complicated by my mapping *.cshtml to *.html for it to otherwise be treated as html:
"files.associations": {
"*.cshtml": "html"
},
I have not yet tried removing that mapping to see if the script validation would continue.
Hat-tip
Hat-tip to this answer, which mentioned:
You can disable JavaScript build-in validation with "javascript.validate.enable": false in settings.json and then enable either ESLint or JSHint extensions to fine-tune errors and validations.
Just needed to edit that to its html equivalent.

VSC Pylance disable linting for Python

I am using the Python and Pylance extensions in Visual Studio Code for the benefit of syntax highlighting, auto completion and code suggestions.
Whenever I save a file within the workspace, the linter automatically parses the file and makes corrections where necessary, in my case this also adds a large amount of unrequired new lines around my inline documentation.
Here is a demonstration of the above mentioned behaviour after a file is saved:
I have attempted to disable the Python Linter for VSC through numerous methods mentioned in other questions to no avail. Whenever I save a file within the workspace, the linter automatically parses the file and makes corrections where necessary, in my case this also adds a large amount of unrequired new lines around my inline documentation.
settings.json file:
{
"python.linting.enabled": false,
"python.languageServer": "None",
"python.linting.ignorePatterns": [
".vscode/*.py",
],
}
The Linter setting is disabled within my VSC workspace and user settings:
What I don't understand additionally is that I have disabled Lint On Save though this behaviour still persists:
I have confirmed this is definitely behaviour coming from the Pylance/Python extensions, when I disable them the issue goes away.
Turns out the setting editor.formatOnSave in VSC does this globally for all languages and seems to have resolved automatic formatting.

VSC Highlighting with Svelte

I have been trying out Svelte for the last couple of days.
Everything is working fine, but then for some reason I get those weird highlighting bugs in VSC.
Whenever that happens, VSC is basically no longer useable (No IntelliSense, weird Highlighting, ...)
Has anyone of you experienced similar problems with Svelte?
I recommend you update your IDE, your plugins and svelte if you haven’t already, to use the official Svelte plugin for VS code, to disable other plugins that may conflict with IntelliSense, and reloading VS Code. If the problem persists, it would be better to ask for help on the plugin’s Github page.

Visual Studio Code Autocomplete Add Parentheses After Method in .js File

When I type console.lo in a .js file in Visual Studio Code, I can hit Enter, and autocomplete will change my line to console.log. However, I would also like autocomplete to add parentheses. This question was already asked using the Go programming language. I tried adding js.useCodeSnippetsOnFunctionSuggest as well as javascript.useCodeSnippetsOnFunctionSuggest. Neither of these work. I also tried useCodeSnippetsOnMethodSuggest as suggested here, but that didn't work either. What am I doing wrong?
I fixed this by searching for "Complete Function Calls" in VS Code's settings, and checking JavaScript > Suggest: Complete Function Calls. Thanks Mark for the suggestion.