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",
}
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"
I am learning to build a Website on Python Django, but when I create a HTML file in VS code, this Editor don't recognize this file. You can see in following picture. I don't know how to solve this problem. Pls help me if you know, thank you very much
Try to install any HTML extension
Turn on HTML5 suggestion in settings.json file:
"html.suggest.html5": true
Follow this post
No HTML suggestions in Visual Studio Code
Note that in the bottom right-hand corner of your screen, the document language is Python Django, but if you click that and change the language to HTML, you will get HTML language features.
if necessary, sometimes it can be useful to compose a document in a side-by-side window that has the language type you need, to get the hinting and auto completion features, and then copy that into the adjoining document.
After installing and activating Django extension;
File - Preferences - Settings
Then find "Emmet:Include Languages" (You can use CTRL + F for that)
After that arrange "Item" and "Value":
Item = django-html
Value = html
Then click OK
In this way, it will be solved I guess
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"
}
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.