[英]Is there a way to make Visual Studio Code recognize HTML syntax in EJS files
I am using Visual Studio Code on a Mac to work on Node.js applications. 我在Mac上使用Visual Studio Code来处理Node.js应用程序。
Is there a way to make Visual Studio Code recognize EJS files as HTML markup? 有没有办法让Visual Studio Code将EJS文件识别为HTML标记? I didn't see any file / scheme association in user preferences.
我没有在用户首选项中看到任何文件/方案关联。
Actually, you can. 实际上,你可以。
As Andre points out, now you can do this in the workspace settings.Go to Visual Studio Code Settings: File >> Preferences >> User Settings
正如Andre指出的那样,现在您可以在工作区设置中执行此操作。转到Visual Studio代码设置:
File >> Preferences >> User Settings
// Place your settings in this file to overwrite the default settings { // Configure file associations to languages (eg "*.extension": "html"). These have precedence over the default associations of the languages installed. "files.associations": {"*.ejs": "html"} }
Click on the 'Plain text' tab at the bottom of the VS Code window and change it to HTML
, screenshot below: 单击VS Code窗口底部的“纯文本”选项卡,将其更改为
HTML
,截图如下:
Go to Visual Studio Code Settings. 转到Visual Studio代码设置。 File >> Preferences >> User Settings
文件>>首选项>>用户设置
Add this line in the settings.json. 在settings.json中添加此行。
// Place your settings in this file to overwrite the default settings
{
// Configure file associations to languages (e.g. "*.extension": "html"). These have precedence over the default associations of the languages installed.
"files.associations": {"*.ejs": "html"}
}
Restart Visual Studio Code. 重新启动Visual Studio代码。
There is an extension for .ejs support. .ejs支持有一个扩展名。 Launch VS Code Quick Open (Ctrl+P), paste the following command, and type enter.
启动VS Code Quick Open(Ctrl + P),粘贴以下命令,然后键入enter。
ext install ejs-language-support
Following the directions given by documentation I changed this file c:\\Program Files(x86)\\Microsoft VS Code\\resources\\app\\extensions\\html\\package.json so it looks like this: 按照文档给出的指示,我更改了此文件c:\\ Program Files(x86)\\ Microsoft VS Code \\ resources \\ app \\ extensions \\ html \\ package.json,所以它看起来像这样:
{
"name": "html",
"version": "0.1.0",
"publisher": "vscode",
"engines": { "vscode": "*" },
"extensionDependencies": [
"html"
],
"contributes": {
"languages": [{
"id": "html",
"aliases": ["ejs"],
"extensions": [".ejs"]
}]
}
}
tried..works for me..too lazy to create a new folder atm 试过......为我工作..懒得创建一个新的文件夹atm
Locate the html
extension in VSCode extensions
folder: 在VSCode
extensions
文件夹中找到html
扩展extensions
:
../app/extensions/html
that on MacOS X is 在MacOS X上是
/Applications/Visual Studio Code.app/Contents/Resources/app/extensions/html
and on Windows is 在Windows上
c:\\Program Files(x86)\\Microsoft VS Code\\resources\\app\\extensions\\html\\package.json
Now edit the file package.json
adding .ejs
the extensions
array only: 现在编辑文件
package.json
仅添加.ejs
extensions
数组:
{
"name": "html",
"version": "0.1.0",
"publisher": "vscode",
"engines": { "vscode": "*" },
"contributes": {
"languages": [{
"id": "html",
"extensions": [ ".html", ".htm", ".shtml", ".mdoc", ".jsp", ".asp", ".aspx", ".jshtm", ".ejs" ],
"aliases": [ "HTML", "htm", "html", "xhtml" ],
"mimetypes": ["text/html", "text/x-jshtm", "text/template", "text/ng-template"]
}],
"grammars": [{
/* "language": "html", not yet enabled*/
"scopeName": "text.html.basic",
"path": "./syntaxes/HTML.plist"
}]
}
}
By the way, the correct way should be to create a ejs
extension
in the extensions
folder and then adding: 顺便说一下,正确的方法应该是在
extensions
文件夹中创建一个ejs
extension
,然后添加:
ejs/
ejs/package.json
ejs/snippet/
ejs/snippet/ejs.json
ejs/syntaxes/
ejs/syntaxes/EJS.plist
Of course this should have the EJS syntax / grammar, but we can simply duplicate the html one, so from the extensions folder: 当然这应该有EJS语法/语法,但我们可以简单地复制html,所以从extensions文件夹:
cd html/
cp -r * ../ejs/
The package.json
then could be like 然后
package.json
就像
{
"name": "ejs",
"version": "0.1.0",
"publisher": "vscode",
"engines": { "vscode": "*" },
"contributes": {
"languages": [{
"id": "ejs",
"extensions": [ ".ejs" ],
"aliases": [ "EJS", "ejs" ],
"mimetypes": ["text/html", "text/x-jshtm", "text/template", "text/ng-template"]
}],
"grammars": [{
"scopeName": "text.html.basic",
"path": "./syntaxes/EJS.plist"
}]
}
}
so change syntaxes/HTML.plist
just copied to syntaxes/EJS.plist
. 所以更改
syntaxes/HTML.plist
只是复制到syntaxes/EJS.plist
。
Then restart VSCode. 然后重启VSCode。
The new release, allow us add textmate snippets: 新版本允许我们添加textmate片段:
https://code.visualstudio.com/updates#_add-textmate-snippets https://code.visualstudio.com/updates#_add-textmate-snippets
maybe we can add this one for ejs support: 也许我们可以为ejs支持添加这个:
https://github.com/gregory-m/ejs-tmbundle/blob/master/Syntaxes/JavaScript%20Template.tmLanguage https://github.com/gregory-m/ejs-tmbundle/blob/master/Syntaxes/JavaScript%20Template.tmLanguage
In Visual Studio 2015 Community I was able to associate the ejs extension with the html editor: 在Visual Studio 2015社区中,我能够将ejs扩展与html编辑器相关联:
Tools > Options > Text Editor > File Extension 工具>选项>文本编辑器>文件扩展名
Enter "ejs" in the extension. 在扩展名中输入“ejs”。 Pick "HTML Editor" from the dropdown selection.
从下拉列表中选择“HTML编辑器”。 Click Add.
单击添加。 Click OK.
单击确定。
If you have an ejs file open, close it and reopen. 如果您打开了一个ejs文件,请将其关闭并重新打开。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.