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"
Related
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"
}
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"
}