Prettier vscode extension not support Django template tags {% tag %}
Question:
Prettier visual studio code extension not support Django template tags {% tag %}
now How can I fix this?
Do I have to disable Prettier extension for html files or is there another solution؟؟
issues 5581 in github = No Django template tags support
Answers:
February 2022
Based on @Al Mahdi’s comment: Prettier does not support prettier.disableLanguages
option anymore. Therefore, to ignore certain files you have to create a .prettierignore file akin a .gitignore file (for people who use Git). The file lives in the root folder of your project. Source of my examples below.
To ignore one file you could type in a particular filename:
# Ignoring just one file
my_cool_html_file.html
Or you could use a blanket statement:
# Ignoring all html files
*.html
There is also the pragma option (<!--prettier-ignore-->
) which lets you ignore bits and pieces of code from particular files. Suppose in your my_cool_html_file.html
you want to not have Prettier format some lines in it, you could:
<!-- prettier-ignore -->
<div class="x" >hello world</div >
<!-- prettier-ignore-attribute -->
<div
(mousedown)=" onStart ( ) "
(mouseup)=" onEnd ( ) "
></div>
<!-- prettier-ignore-attribute (mouseup) -->
<div
(mousedown)="onStart()"
(mouseup)=" onEnd ( ) "
></div>
July 2020 (old answer)
You can do two things:
-
Disable Prettier on HTML files by adding this command in the
‘settings.json’ file:
"prettier.disableLanguages": ["html"]
This will ensure, if you have enabled it, VS Code’s inherent HTML formatting.
OR
- You can install a Django extension like this one. However, the problem with this extension is that it disables VS Codes inherent HTML intellisense (which I personally like).
Hope this helps.
Like @ahimsauzi pointed out, the solution is
"prettier.disableLanguages": ["django-html"]
Just disable "django-html"
.
When using "prettier.disableLanguages": ["django-html"]
I got the below warning in VS Code:
This feature is no longer supported. Instead, configure VS Code
default
formatters
or use .prettierignore.
I followed the instructions and was able to disable prettier in django-html
files by adding the following to settings.json
:
"[django-html]": {
"editor.formatOnSave": false
}
This tells VS Code to not run automatic formatting when saving django-html
files. However, if you are using other formatters along side pretty, and you only want to prevent pretty from formatting, then this might not be an optimal solution.
Alternative method:
The other method that the warning suggested was to use a .prettierignore
file. You simply place the file in your source root directory and specify the files, directories, patterns, etc, that you would like pretty to ignore. The syntax is the same as a .gitignore
file. You can read more about it here.
- Create a .prettierignore file in your project directory.
- Add *.html in the .prettierignore file.
Now prettier will ignore all the html files in your current project.
I don’t Know if it works for you, but I can solve the problem by not using prettier in django templates, installing djlint as dev dependence in my project(I’m using pipenv you can install it as system wide package) and installing the djlint extension in vscode.
After install djlint we need to configure our vscode
"[html]": {
"editor.defaultFormatter": "monosans.djlint"
},
"[django-html]": {
"editor.defaultFormatter": "monosans.djlint"
},
If you don’t want to include that configuration in the global settings, you can add them in the workspace settings.
I hope my solution works for you
Prettier visual studio code extension not support Django template tags {% tag %}
now How can I fix this?
Do I have to disable Prettier extension for html files or is there another solution؟؟
issues 5581 in github = No Django template tags support
February 2022
Based on @Al Mahdi’s comment: Prettier does not support prettier.disableLanguages
option anymore. Therefore, to ignore certain files you have to create a .prettierignore file akin a .gitignore file (for people who use Git). The file lives in the root folder of your project. Source of my examples below.
To ignore one file you could type in a particular filename:
# Ignoring just one file
my_cool_html_file.html
Or you could use a blanket statement:
# Ignoring all html files
*.html
There is also the pragma option (<!--prettier-ignore-->
) which lets you ignore bits and pieces of code from particular files. Suppose in your my_cool_html_file.html
you want to not have Prettier format some lines in it, you could:
<!-- prettier-ignore -->
<div class="x" >hello world</div >
<!-- prettier-ignore-attribute -->
<div
(mousedown)=" onStart ( ) "
(mouseup)=" onEnd ( ) "
></div>
<!-- prettier-ignore-attribute (mouseup) -->
<div
(mousedown)="onStart()"
(mouseup)=" onEnd ( ) "
></div>
July 2020 (old answer)
You can do two things:
-
Disable Prettier on HTML files by adding this command in the
‘settings.json’ file:"prettier.disableLanguages": ["html"]
This will ensure, if you have enabled it, VS Code’s inherent HTML formatting.
OR
- You can install a Django extension like this one. However, the problem with this extension is that it disables VS Codes inherent HTML intellisense (which I personally like).
Hope this helps.
Like @ahimsauzi pointed out, the solution is
"prettier.disableLanguages": ["django-html"]
Just disable "django-html"
.
When using "prettier.disableLanguages": ["django-html"]
I got the below warning in VS Code:
This feature is no longer supported. Instead, configure VS Code
default
formatters
or use .prettierignore.
I followed the instructions and was able to disable prettier in django-html
files by adding the following to settings.json
:
"[django-html]": {
"editor.formatOnSave": false
}
This tells VS Code to not run automatic formatting when saving django-html
files. However, if you are using other formatters along side pretty, and you only want to prevent pretty from formatting, then this might not be an optimal solution.
Alternative method:
The other method that the warning suggested was to use a .prettierignore
file. You simply place the file in your source root directory and specify the files, directories, patterns, etc, that you would like pretty to ignore. The syntax is the same as a .gitignore
file. You can read more about it here.
- Create a .prettierignore file in your project directory.
- Add *.html in the .prettierignore file.
Now prettier will ignore all the html files in your current project.
I don’t Know if it works for you, but I can solve the problem by not using prettier in django templates, installing djlint as dev dependence in my project(I’m using pipenv you can install it as system wide package) and installing the djlint extension in vscode.
After install djlint we need to configure our vscode
"[html]": {
"editor.defaultFormatter": "monosans.djlint"
},
"[django-html]": {
"editor.defaultFormatter": "monosans.djlint"
},
If you don’t want to include that configuration in the global settings, you can add them in the workspace settings.
I hope my solution works for you