I'd like to configure VSCode to not auto-format files in a specific directory.
Background: I'm writing a library that renders json into html. For testing, I'm comparing the results with pre-rendered html snippets. Unfortunately, VSCode *cks up my formatting of the html files with it's auto-format feature. Although auto-formatting is very handy for my actual code, I'd like to turn it off for those snippets.
Is there any option to turn it off for files in a specific directory or for files matching a specific pattern in filename? If yes: Is it possible to have the settings stored in the project folder?
So far I only found the option to turn auto-formatting on/off per language. This is close but not perfect, since there are other html files in my project that would benefit from auto-formatting.
Try to add (for example, if you language is JavaScript):
"[javascript]": {
"editor.formatOnSave": true
},
"files.associations": {
"src/some-folder/*.js": "plaintext"
}
Related
I have two extensions installed one is Django (Baptiste Darthenay) and other is HTML Snippets (Mohamed Abusaid). By default every .html file was getting detecting as django-html and it had no intellisense so I changed the file.associations to following:
this has solved problem for html files which are not inside **/tempaltes/**/* but anything in side it doesnt have any intellisense at all.
You can tell Emmet (which is what's used for these snippets; details here) to use one language's snippets in another. To enable the html snippets in the django-html language, add the following to your VS Code settings (in the settings JSON editor):
"emmet.includeLanguages": {
"django-html": "html"
},
In the Settings UI mode, you can find this as Emmet: Include Languages. Click "Add Item", set "Key" to django-html and "Value" to html, then click "OK"
is there any option to work in mako templates (based on HTML it is something like Flask but very old) and use all extensions from HTML? I installed mako templates extension but that is just for a syntax highlighting.
I used to work in Atom and there was a extension which uses both of languages.
For examaple: see hints while writting bootstrap classes col-something etc.
So far Iam using this:
"emmet.includeLanguages": {
"mako": "html"
}
I can use Emmet Abbrevation but that is all.
Thanks for any help.
Adding a file extension to a language
You can add new file extensions to an existing language with the files.associations setting.
For example, the setting below adds the .myphp file extension to the php language identifier:
"files.associations": {
"*.myphp": "php"
}
See more: https://code.visualstudio.com/docs/languages/overview
I have some Angular component HTML some.component.html that I'm trying to format. When I hit ctrl-shiftp, and selectFormat Document` I get the message:
There is no document formatter for 'nunjucks'-files installed.
So it seems VSCode thinks that the .html file is a nunjucks file.
Is there a way to make it think that it's a html file?
You can switch back to HTML by clicking on the word "Nunjucks" in VS Code's status bar. This "Language Indicator" is near the bottom-right of VS Code's window. Clicking it will display a "Select Language Mode" drop-down-list where you can select "HTML".
After that, things that normally work for HTML files (like Format Document) will work again; however, things like the special syntax highlighting applied to Nunjuck files will not, but you can switch back and forth as needed.
Here's VS Code's documentation for Changing the language for the selected file.
Explicitly adding a "file.associations" in settings.json seems to solve the need to switch back-and-forth.
"files.associations": {
"*.html": "html",
}
I'm using Visual Studio Code (1.17.1, on MacOS 10.13 AND Windows 10) developing an asp.net core mvc web app using razor templating.
Visual Studio Code supports Emmet (https://code.visualstudio.com/docs/editor/emmet)
My issue is that Emmet works correctly in HTML files, but will not work in razor CSHTML files.
I've found:
To enable the Emmet abbreviation expansion in file types where it is not available by default, use the emmet.includeLanguages setting. Make sure to use language ids for both sides of the mapping.
https://code.visualstudio.com/docs/editor/emmet
but it doesn't indicate where to find a list of "language ids". I tried searching for it, but you can imagine what happens when you search for programming language id!
Is there a way to tell Emmet in VS Code to treat cshtml files as html files? Is there any other way to get this to work (besides renaming the files, which is another solution out there)?
According to this link, the corresponding language for *.cshtml files is razor, thus you need to specify it in the emmet mappings as follows:
"emmet.includeLanguages": {
"razor": "html"
}
updated:
Press Ctrl+K than M (Ctrl+K,M) than select highlighter from the dropdownlist you want this is a common shortcut. very useful. even works for any file types. ie. create a new file and code some xml or what language you want than Ctrl+K,M you can specify/override ide hilighter on the fly. very useful shortcut. try it. you won't forget Ctrl+K,M. one of most useful hotkey combination I ever use in vscode. by this way code-completion wakes up and works as language you selected.
in vscode > settings.json
I added the related codes mentionel above. emmet worked for cshtml files.
"emmet.includeLanguages": {
"razor":"html",
"aspnetcorerazor":"html"
}
PhpStorm can apply code style rules for specific languages with the Reformat Code command. PhpStorm can also recognize a language embedded within a file of another language (known in PhpStorm as 'Language Injection'). So, I expect that a language would be subject to its code style rules wherever the language is used -- whether embedded or in its own file.
I've found that this works as expected for css/js within an html file, but not for language injections within PHP files. PhpStorm will recognize css within a heredoc, and html as a heredoc and in single- and double- quoted strings -- yet reformatting does not work in any of these cases.
Short of using an intermediary file to reformat the code, how can I get PhpStorm to reformat these sections of code? I am using PhpStorm 6.0.3 for Mac.
Their documentation states:
PhpStorm supports full coding assistance for:
CSS and JavaScript in an HTML or XML file.
CSS, JavaScript, and SQL outside PHP code blocks and inside PHP string literals.
The second bullet seems only half true, as css/js/sql are recognized but not subjected to code styles inside PHP string literals. And injected html is not specified; but between PhpStorm recognizing the language injections and its capability to apply code styles to an arbitrary selection, all the pieces for formatting embedded languages seem to be there. What am I missing?
To reformat injected code according to PhpStorm code styles Preferences, select the injected code and open the Intention Actions list (Alt+Enter), and select "Edit __ Fragment" to edit it in it's own dedicated window (documentation). In this window, code formatting will work as expected.