If I start an .ejs file with a tag like h1, it is underlined in red, like VSCode expects me to add the whole typical html boilerplate. However, I have seen many videos where the host doesn't get this underlining.
I have tried extensions, I have modified the settings.json with "*.ejs": "html", but nothing works.
Do you know how I can get rid of it without having to add DOCTYPE, , etc.?
So after figuring out that this problem caused by a lint or other validator (in this case W3C Validator) installed as an extension in Visual Studio Code, you can disable its warnings by going to extensions and disable the validator.
However, those tools are here for a reason :) and they help us write better code that fits to known standards and syntax issues, so disabling them is less recommended. (Although it can become bit annoying while using external third-party libs which can be can some warnings by that validator too - for that, some lints offers ignoring logic which let you ignore some of the files or lines in the code).
Good Luck, Happy coding!
Related
I recently started writing SCSS in VSCode. VSCode itself along with vscode-scss extension provides relatively good support for SCSS, but an important feature seems missing - error checking.
Though VSCode and vscode-scss can offer suggestions through Intellisense based on scanning, no errors will be prompted if I misspelled a variable, or used a mixin that hadn't been imported yet. Also, no auto refactoring takes place after renaming an SCSS file that has been used by other sources.
Is there any VSCode extension that provides such validations? Or maybe they can be turned on through some options in extension settings?
Note: I do have noticed the scss.showErrors option of vscode-scss, but no errors get prompted in scenarios mentioned above after turning this option on.
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.
Is there any way to get another editor, like VSCode, to format code ( JavaScript in my case, if it matters ) like the WebStorm IDE formats code by default? I'm not familiar with that IDE, but I'm hoping that it uses a config of some sort that can maybe be exported and imported in another editor. I tried looking for one, but couldn't find anything.
The core problem, if it matters, is that all of our team members use WS to write code and they use the built in formatter, so if I use another one it creates inconsistencies and long commits when editing already written files. As you are probably guessing by now, I would like to use another editor, because I find IDE's bloated and slow.
I don't know if there is a way to import Webstorm formatting rules into VS Code, but I think there is another solution:
I remember in one of the projects i worked on, we used a linter which also auto-formatted code. The advantage is that Webstorm and VSCode can pick pick the linter rules automatically, and then you have same formatting on both.
The downside is that you would need to agree with the team on what does rule will be and then configure them on the linter.
I tried Intelephense and dozens of other extensions and settings but NONE of them achieved what I'm after. What I prioritize is automatic tag close and automatic indent... most of others VSC functionalities for HTML would be great too, like css classes or files paths suggestions, but what I really need is this 'basic' automatic format...
I'm sorry for this question, I know it's been done and answered before, it's just that I can't get my VSC to correctly work with HTML when mixed with PHP, and I've been trying for months now... Read everything I've found on Google, searched about it here and on Reddit, but wasn't able to reproduce any of the solutions, or better saying, none of them worked for me.
Could anyone give me some guidance?
Luckily I felt the same way as you so I just decided to go ahead and hammer out a solution to this very annoying problem with a VScode extension that doesn't register itself as a "formatting" extension I format the HTML onBeforeSave so you can still register a PHP formatting extension so between the two it gets the whole file. I use js-beautify so you can just use all the native HTML formatting settings in VSCode already.
Format HTML in PHP on the VSCode Extension Marketplace.
10 shillings to whomever can tell me how to switch the error/warning decoration in vscode from a squiggly underline to an outline. It's what I am used to in Sublime Text, but I cannot seem to find the option to change it in vscode. Perhaps it is not possible? Knowing that would be a sufficient answer too.
As far as I know, there isn't a setting for this.
There IS an extension point for decorating text that would allow this, but as far as I know it isn't possible to access the errors for a file from the API to decorate the text. You can create new ones, but I don't believe it is possible to access existing errors.
tl;dr - I don't think this is possible at the moment.
`Microsoft/vscode issue 9209 points out more recently (2019/2020) to:
Error Gutter: This is the VSCodium (or Visual Studio Code) version of error gutters available in other text editors, such as Sublime Text or Atom.
And:
Error Lens: ErrorLens turbo-charges language diagnostic features by making diagnostics stand out more prominently, highlighting the entire line wherever a diagnostic is generated by the language and also prints the message inline.