blocks|key|4503961|text|实际上，你可以的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4503962|正如安德烈所指出的，现在您可以在工作区settings.Go+to+Visual+Studio+Code+Settings：File+>>+Preferences+>>+User+Settings中执行此操作|offset|length|style|CODE|4503963|​|4503964|//+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"}+++++
+}|code-block|syntax|javascript|4503965|4503966|点击VS+Code窗口底部的'Plain+text‘选项卡，并将其更改为HTML，屏幕截图如下：|4503967|4503968|📷|atomic|4503969|4503970|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/4ad5162c072712c03c77eaaff9c954fd.png|imageAlt^0|0|1Q|10|0|0|0|0|10|4|0|0|0|1|0|0|0^^$0|@$1|2|3|4|5|6|7|15|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|16|8|@$D|17|E|18|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|19|8|@]|9|@]|A|$]]|$1|J|3|K|5|L|7|1A|8|@]|9|@]|A|$M|N]]|$1|O|3|I|5|6|7|1B|8|@]|9|@]|A|$]]|$1|P|3|Q|5|6|7|1C|8|@$D|1D|E|1E|F|G]]|9|@]|A|$]]|$1|R|3|I|5|6|7|1F|8|@]|9|@]|A|$]]|$1|S|3|T|5|U|7|1G|8|@]|9|@$D|1H|E|1I|1|1J]]|A|$]]|$1|V|3|I|5|6|7|1K|8|@]|9|@]|A|$]]|$1|W|3|-4|5|6|7|1L|8|@]|9|@]|A|$]]]|X|$Y|$5|Z|10|11|A|$12|13|14|-4]]]]

Actually, you can. 

As Andre points out, now you can do this in the workspace settings.Go to Visual Studio Code Settings: <code>File &gt;&gt; Preferences &gt;&gt; User Settings</code>

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>// 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"} 
 }</code></pre>
</div>
</div>


Click on the 'Plain text' tab at the bottom of the VS Code window and change it to <code>HTML</code>, screenshot below:

<a href="https://i.stack.imgur.com/AG49L.png" rel="noreferrer"><img src="https://i.stack.imgur.com/AG49L.png" alt="enter image description here"></a>

blocks|key|4504494|text|转到Visual+Studio代码设置。>>文件>>首选项>>用户设置|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4504495|在settings.json中添加此行。|4504496|//+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"}+++++
}|code-block|syntax|javascript|4504497|重新启动Visual+Studio代码。|4504498|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|O|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|P|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

Go to Visual Studio Code Settings. 
File >> Preferences >> User Settings

Add this line in the settings.json.

<pre><code>// 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"} 
}
</code></pre>

Restart Visual Studio Code.

blocks|key|4504538|text|有一个支持.ejs的扩展。启动VS+Code+Quick+Open+(Ctrl%2BP)，粘贴以下命令，然后键入enter。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4504539|ext+install+ejs-language-support|code-block|syntax|javascript|4504540|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

There is an extension for .ejs support. Launch VS Code Quick Open (Ctrl+P), paste the following command, and type enter.

<pre><code>ext install ejs-language-support
</code></pre>

blocks|key|4504229|text|按照Code\resources\app\extensions\html\package.json给出的说明，我更改了文件c:\Program+Files(x86)\Microsoft+VS+documentation，使其如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4504230|{
++++"name":+"html",
++++"version":+"0.1.0",
++++"publisher":+"vscode",
++++"engines":+{+"vscode":+"*"+},
++++"extensionDependencies":+[
+++++++++++++++++++++"html"
++++++++++++++++],
++++"contributes":+{
++++++++"languages":+[{
++++++++++++"id":+"html",
++++++++++++"aliases":+["ejs"],
++++++++++++"extensions":+[".ejs"]
++++++++}]
++++}
}|code-block|syntax|javascript|4504231|用于me..too延迟创建新文件夹自动柜员机的tried..works|4504232|entityMap|0|LINK|mutability|MUTABLE|url|https://code.visualstudio.com/docs/customization/colorizer^0|2O|D|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@$A|T|B|U|1|V]]|C|$]]|$1|D|3|E|5|F|7|W|8|@]|9|@]|C|$G|H]]|$1|I|3|J|5|6|7|X|8|@]|9|@]|C|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|C|$]]]|L|$M|$5|N|O|P|C|$Q|R]]]]

Following the directions given by <a href="https://code.visualstudio.com/docs/customization/colorizer">documentation</a>
I changed this file c:\Program Files(x86)\Microsoft VS Code\resources\app\extensions\html\package.json 
so it looks like this: 

<pre><code>{
 "name": "html",
 "version": "0.1.0",
 "publisher": "vscode",
 "engines": { "vscode": "*" },
 "extensionDependencies": [
 "html"
 ],
 "contributes": {
 "languages": [{
 "id": "html",
 "aliases": ["ejs"],
 "extensions": [".ejs"]
 }]
 }
}
</code></pre>

tried..works for me..too lazy to create a new folder atm

blocks|key|4504430|text|在VSCode+extensions文件夹中找到html扩展：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4504431|../app/extensions/html|4504432|在MacOS+X上，|4504433|/Applications/Visual+Studio+Code.app/Contents/Resources/app/extensions/html|4504434|在Windows上是|4504435|c:\Program+Files(x86)\Microsoft+VS+Code\resources\app\extensions\html\package.json|4504436|现在编辑文件，仅添加.ejs+extensions阵列：|4504437|{
++++++++"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"
++++++++++++++++}]
++++++++}

}|code-block|syntax|javascript|4504438|顺便说一下，正确的方法应该是在extensions文件夹中创建一个ejs+extension，然后添加：|4504439|ejs/
ejs/package.json
ejs/snippet/
ejs/snippet/ejs.json
ejs/syntaxes/
ejs/syntaxes/EJS.plist|4504440|当然，这应该包含EJS语法/语法，但我们可以简单地复制html语法，因此从extensions文件夹：|4504441|cd+html/
cp+-r+*+../ejs/|4504442|然后，package.json可以是这样的|4504443|{
++++++++"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"
++++++++++++++++}]
++++++++}

}|4504444|因此，更改刚刚复制到syntaxes/EJS.plist的syntaxes/HTML.plist。|4504445|然后重新启动VSCode。|4504446|entityMap^0|8|A|O|4|0|0|M|0|0|0|23|0|0|0|2A|0|A|4|F|A|0|0|F|A|X|3|11|9|0|0|0|0|3|C|0|0|A|I|T|J|0|0^^$0|@$1|2|3|4|5|6|7|1E|8|@$9|1F|A|1G|B|C]|$9|1H|A|1I|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1J|8|@$9|1K|A|1L|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|1M|8|@]|D|@]|E|$]]|$1|J|3|K|5|6|7|1N|8|@$9|1O|A|1P|B|C]]|D|@]|E|$]]|$1|L|3|M|5|6|7|1Q|8|@]|D|@]|E|$]]|$1|N|3|O|5|6|7|1R|8|@$9|1S|A|1T|B|C]]|D|@]|E|$]]|$1|P|3|Q|5|6|7|1U|8|@$9|1V|A|1W|B|C]|$9|1X|A|1Y|B|C]]|D|@]|E|$]]|$1|R|3|S|5|T|7|1Z|8|@]|D|@]|E|$U|V]]|$1|W|3|X|5|6|7|20|8|@$9|21|A|22|B|C]|$9|23|A|24|B|C]|$9|25|A|26|B|C]]|D|@]|E|$]]|$1|Y|3|Z|5|T|7|27|8|@]|D|@]|E|$U|V]]|$1|10|3|11|5|6|7|28|8|@]|D|@]|E|$]]|$1|12|3|13|5|T|7|29|8|@]|D|@]|E|$U|V]]|$1|14|3|15|5|6|7|2A|8|@$9|2B|A|2C|B|C]]|D|@]|E|$]]|$1|16|3|17|5|T|7|2D|8|@]|D|@]|E|$U|V]]|$1|18|3|19|5|6|7|2E|8|@$9|2F|A|2G|B|C]|$9|2H|A|2I|B|C]]|D|@]|E|$]]|$1|1A|3|1B|5|6|7|2J|8|@]|D|@]|E|$]]|$1|1C|3|-4|5|6|7|2K|8|@]|D|@]|E|$]]]|1D|$]]

Locate the <code>html</code> extension in VSCode <code>extensions</code> folder:

<code>../app/extensions/html</code>

that on MacOS X is 

<code>/Applications/Visual Studio Code.app/Contents/Resources/app/extensions/html</code>

and on Windows is

<code>c:\Program Files(x86)\Microsoft VS Code\resources\app\extensions\html\package.json</code>

Now edit the file <code>package.json</code> adding <code>.ejs</code> the <code>extensions</code> array only:

<pre><code>{
 "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"
 }]
 }

}
</code></pre>

By the way, the correct way should be to create a <code>ejs</code> <code>extension</code> in the <code>extensions</code> folder and then adding:

<pre><code>ejs/
ejs/package.json
ejs/snippet/
ejs/snippet/ejs.json
ejs/syntaxes/
ejs/syntaxes/EJS.plist
</code></pre>

Of course this should have the EJS syntax / grammar, but we can simply duplicate the html one, so from the extensions folder:

<pre><code>cd html/
cp -r * ../ejs/
</code></pre>

The <code>package.json</code> then could be like

<pre><code>{
 "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"
 }]
 }

}
</code></pre>

so change <code>syntaxes/HTML.plist</code> just copied to <code>syntaxes/EJS.plist</code>.

Then restart VSCode.

blocks|key|4504291|text|新版本允许我们添加textmate代码片段：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4504292|https://code.visualstudio.com/updates#_add-textmate-snippets|offset|length|4504293|也许我们可以添加这个来支持ejs：|4504294|https://github.com/gregory-m/ejs-tmbundle/blob/master/Syntaxes/JavaScript%2520Template.tmLanguage|4504295|entityMap|0|LINK|mutability|MUTABLE|url|1|https://github.com/gregory-m/ejs-tmbundle/blob/master/Syntaxes/JavaScript%2520Template.tmLanguage^0|0|0|1O|0|0|0|0|2N|1|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@]|9|@$D|U|E|V|1|W]]|A|$]]|$1|F|3|G|5|6|7|X|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|Y|8|@]|9|@$D|Z|E|10|1|11]]|A|$]]|$1|J|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|K|$L|$5|M|N|O|A|$P|C]]|Q|$5|M|N|O|A|$P|R]]]]

The new release, allow us add textmate snippets: 
<a href="https://code.visualstudio.com/updates#_add-textmate-snippets" rel="nofollow">https://code.visualstudio.com/updates#_add-textmate-snippets</a> 
maybe we can add this one for ejs support: 
<a href="https://github.com/gregory-m/ejs-tmbundle/blob/master/Syntaxes/JavaScript%20Template.tmLanguage" rel="nofollow">https://github.com/gregory-m/ejs-tmbundle/blob/master/Syntaxes/JavaScript%20Template.tmLanguage</a>

blocks|key|4504101|text|在Visual+Studio+2015社区中，我能够将ejs扩展与html编辑器关联起来：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4504102|工具>选项>文本编辑器>文件扩展名|4504103|在扩展名中输入"ejs“。从下拉选择中选择"HTML编辑器“。单击Add。单击OK。|4504104|如果您打开了一个ejs文件，请将其关闭并重新打开。|4504105|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|J|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|K|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|L|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|M|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|I|$]]

In Visual Studio 2015 Community I was able to associate the ejs extension with the html editor:

Tools > Options > Text Editor > File Extension

Enter "ejs" in the extension. Pick "HTML Editor" from the dropdown selection. Click Add. Click OK.

If you have an ejs file open, close it and reopen.

I am using Visual Studio Code on a Mac to work on Node.js applications.

Is there a way to make Visual Studio Code recognize EJS files as HTML markup? I didn't see any file / scheme association in user preferences.

Is there a way to make Visual Studio Code recognize HTML syntax in EJS files

Visual Studio

Windows

MacOS

我在Mac上使用Visual Studio Code来处理Node.js应用程序。有没有办法让Visual Studio代码将EJS文件识别为HTML标记？我在用户首选项中没有看到任何文件/方案关联。

问有没有办法让Visual Studio代码识别EJS文件中的HTML语法
EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问有没有办法让Visual Studio代码识别EJS文件中的HTML语法EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问有没有办法让Visual Studio代码识别EJS文件中的HTML语法
EN