HTML 自动完成功能无法与 VSCode 中的 Django 扩展一起使用答案

【问题标题】：HTML autocomplete is not working along with Django extension in VSCodeHTML 自动完成功能无法与 VSCode 中的 Django 扩展一起使用
【发布时间】：2021-05-16 07:33:56
【问题描述】：

我目前正在使用最新版本的 VSCode 和 Django。每当我启用 Baptiste Darthenay 的 Django 扩展时，HTML 自动完成功能就会停止工作。如果我禁用 Django 扩展并重新加载 VSCode，它将重新开始工作。我应该怎么做才能使 HTML 自动完成功能与 Django 扩展一起工作？

【问题讨论】：

您的意思是像 Emmet 中的自动完成功能吗？（例如，输入 .my-class 用该类创建一个 div？）。
我说的是最基本的自动完成，即输入h1，它会建议h1标题的自动完成。

标签： html django visual-studio-code django-extensions

【解决方案1】：

尝试将其添加到您的 settings.json 文件中：

"emmet.includeLanguages": {
    "django-html": "html",
    "jinja-html": "html"
}

此外，您还可以添加这个并根据您的喜好进行调整：

"[django-html]": {
    "editor.defaultFormatter": "HookyQR.beautify",
    "editor.quickSuggestions": {
        "comments": true,
        "other": true,
        "strings": true
    },
    "editor.tabSize": 4,
    "editor.wordWrap": "on"
}

【讨论】：

【解决方案2】：

尝试以下对我有用的解决方案：

在 VSCode 中打开 Django 项目。
打开一个 HTML 文件（例如在您的模板文件夹中）
在 VSCode 屏幕的右下方，您将看到“Django HTML”
单击它，然后您将进入语言选择屏幕
输入 HTML 并点击
您会注意到右下角的提示现在将更改为“HTML”
您现在应该可以正常使用 HTML 的自动完成功能

【讨论】：

【解决方案3】：

只有在settings.json 中添加"emmet.includeLanguages": {"django-html": "html"} 才能解决您提到的问题。

之前：

{
"terminal.integrated.rendererType": "dom",
"liveServer.settings.donotVerifyTags": true,
"liveServer.settings.donotShowInfoMsg": true,
"javascript.updateImportsOnFileMove.enabled": "always",
"workbench.editorAssociations": {
    "*.ipynb": "jupyter.notebook.ipynb"
},
"C_Cpp.updateChannel": "Insiders",
"grunt.autoDetect": "on",
"files.associations": {
    "*.html": "django-html"
},

"[django-html]": {
    "editor.quickSuggestions": {
        "other": true,
        "comments": true,
        "strings": true
    }
}

}

之后：

{
"terminal.integrated.rendererType": "dom",
"liveServer.settings.donotVerifyTags": true,
"liveServer.settings.donotShowInfoMsg": true,
"javascript.updateImportsOnFileMove.enabled": "always",
"workbench.editorAssociations": {
    "*.ipynb": "jupyter.notebook.ipynb"
},
"C_Cpp.updateChannel": "Insiders",
"grunt.autoDetect": "on",
"files.associations": {
    "*.html": "django-html"
},

"emmet.includeLanguages": {"django-html": "html"},

"[django-html]": {
    "editor.quickSuggestions": {
        "other": true,
        "comments": true,
        "strings": true
    }
}

}

您可以在此处查看讨论：https://github.com/vscode-django/vscode-django/issues/16

【讨论】：