[英]Visual Studio Code isn't recognising EJS
I am trying to follow this tutorial and write some code in EJS in VS Code.我正在尝试遵循本教程并在 VS Code 中用 EJS 编写一些代码。 I ran
npm i express ejs
as per the video's instructions to install both Express and EJS, and no errors popped up in the console.我按照视频的说明运行
npm i express ejs
来安装 Express 和 EJS,并且控制台中没有弹出错误。 However, in the bottom right (in the blue bar) it still says HTML, and when I click on this to change the language, EJS doesn't appear in the list.但是,在右下角(在蓝色条中)它仍然显示 HTML,当我单击它更改语言时,EJS 不会出现在列表中。
Am I missing something here?我在这里错过了什么吗? Is there another step I was meant to follow?
我还有另一个步骤吗? Any help would be greatly appreciated.
任何帮助将不胜感激。
By default VSCode does not have syntax highlighting for EJS template files.默认情况下,VSCode 没有 EJS 模板文件的语法高亮。 You need to install a plugin like this one - EJS language support .
你需要安装一个像这样的插件——EJS 语言支持。
You also need to configure the file association for .ejs
files.您还需要为
.ejs
文件配置文件关联。 In order to do so type the following command (using CTRL + SHIFT + P
) - Change language mode
and then select Configure file association for .ejs
, then select HTML
from the dropdown.为此,请键入以下命令(使用
CTRL + SHIFT + P
) - Change language mode
,然后选择Configure file association for .ejs
,然后从下拉列表中选择HTML
。
Working solution (September 2021)工作解决方案(2021 年 9 月)
And add these settings to VScode,并将这些设置添加到 VScode,
"files.associations": { "*.ejs": "html" }, "emmet.includeLanguages": { "ejs": "html", }, "html.format.templating": true
Have fun 😎玩得开心😎
Finally, I found the cause of this problem.最后,我找到了这个问题的原因。
Foremost of all, I installed the EJS language support extension, then I edited settings.json by adding this lines:首先,我安装了EJS 语言支持扩展,然后通过添加以下行来编辑 settings.json:
"files.associations": {
"*.ejs": "html"
},
"emmet.includeLanguages": {
"ejs": "html"
}
I did all that, and my ejs code still not recognized.我做了所有这些,但我的 ejs 代码仍然无法识别。
After a while, I found that the responsible for that in my case is the HTMLHint extension (Mike Kaufman).过了一会儿,我发现在我的例子中负责的是HTMLHint扩展(Mike Kaufman)。
So, I applied with success one of this 2 solutions:因此,我成功应用了以下两种解决方案之一:
"htmlhint.options": {
"spec-char-escape": false,
"doctype-first": false
}
NB: I finally uninstalled the EJS language support extension.注意:我终于卸载了 EJS 语言支持扩展。
VS Code does not have pre-installed syntax for EJS. VS Code 没有为 EJS 预装语法。 You must download the extension plugin for it.
您必须为它下载扩展插件。 try using the following link:
尝试使用以下链接:
Or type the following command in the VS Code Terminal:或者在 VS Code 终端中输入以下命令:
ext install DigitalBrainstem.javascript-ejs-support
I found the solution (how to setup VSCode, no troubles):我找到了解决方案(如何设置 VSCode,没有问题):
EJS language support
pluginEJS language support
插件<? for( let item of array ) { ?>
(some data)
<? } ?>
are formatted incorrectly (at least with default html formatter).格式不正确(至少使用默认的 html 格式化程序)。
ejs.delimeter = '?'
. <? ... ?>
<? ... ?>
<? ... ?>
tags. <? ... ?>
标签。Snippets Ranger
plugin, then find needed extension and edit its file.Snippets Ranger
插件,然后找到所需的扩展并编辑其文件。 The Snippets Ranger
is very handy tool. Snippets Ranger
是非常方便的工具。Ctrl+Shift+P
=> Change language mode
=> set HTML
Ctrl+Shift+P
=> Change language mode
=> 设置HTML
I hope I helped somebody to setup VSCode for .ejs files我希望我帮助某人为 .ejs 文件设置 VSCode
What worked for me, I followed the exact sets shown by Al Mahdi above;对我有用的是,我遵循了上面 Al Mahdi 显示的确切设置; but I did not get the option to change the file to ejs.
但我没有选择将文件更改为 ejs。 So what I did was renamed the file in the Explorer tab in VS code to "filename.ejs" which was in a views folder(not sure if you did this step).
所以我所做的就是将 VS 代码中资源管理器选项卡中的文件重命名为位于视图文件夹中的“filename.ejs”(不确定您是否执行了此步骤)。 Then everything worked perfectly fine for me.
然后一切对我来说都很好。
folder link, not file link文件夹链接,不是文件链接
I admit I was clicking on a folder link too quickly created in the Explorer sidebar like "views\pages\index.esj", so ensure you created a file, not a folder :)我承认我在资源管理器侧边栏中太快地点击了一个文件夹链接,比如“views\pages\index.esj”,所以请确保您创建的是文件,而不是文件夹:)
Head over to https://marketplace.visualstudio.com/items?itemName=DigitalBrainstem.javascript-ejs-support and install EJS Language support前往https://marketplace.visualstudio.com/items?itemName=DigitalBrainstem.javascript-ejs-support并安装 EJS 语言支持
Click on ctr + shift + p and search for settings.json
点击ctr + shift + p并搜索
settings.json
Past this below:过去这个:
"emmet.includeLanguages": {
"ejs": "html"
},
"html.format.templating": true
Make sure there isn't error or misspelling in your code确保您的代码中没有错误或拼写错误
Reload your windows and BOOM!重新加载你的窗户和繁荣! error is solved!
错误已解决! : )
:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.