Visual Studio Code: Treat Other Extensions as HTML

Question

In order to highlight syntax and coloring and intellisense, is it possible to handle other extensions (tpl, master, etc.) like HTML?

I know that this is possible in a file by file by pressing CTRL + SHIFT + P and choosing “Change Language Mode”, but I want it to work with the file extension and should not repeat it every time I open a new file,

I also know that it is possible for some languages, editing json files in the plugins directory, BUT it does not seem to exist for HTML.

Answer 1

Update for VS Code 1.0:

There is a files.associations parameter that can be used to assign file templates to languages. For example:

 "files.associations": { "*.tpl": "html", "*.master": "html" } 

Previous answer:

<y> This is a frequently asked function request, and we are considering this problem for the future.

As a workaround if you need to do solutio now:

• close VS code
• open C:\Users\<your name>\AppData\Local\Code\app-<latest-version>\resources\app\server\lib\mime.js
• find object literal knownTextMimes
• for the file extension you want to add the correct mime type
• e.g. '.tpl': 'text/html'
• save and reload code

Note: this change will not be preserved during automatic updates, but hopes that in the future there will be a better solution :) C>

Answer 2

• Open notepad as an administrator (just in case) by right-clicking as an administrator.
• Click file => open => copy and paste C: \ Program Files (x86) \ Microsoft VS Code \ resources \ app \ extensions \ html into the field.
• select all file types in the lower right.
• Open package.json

• Copy and paste

   { "name": "html", "version": "0.1.0", "publisher": "vscode", "engines": { "vscode": "*" }, "extensionDependencies": [ "html" ], "contributes": { "languages": [{ "id": "html", "aliases": ["pd"], "extensions": [".pd"] }] } } 

replace everything with this. save and exit reboot and code.

Answer 3

Jesse's answer is correct. I don't have enough reputation points to comment on his answer, but the way for Mac users is:

cd /Applications/Visual\ Studio\ Code.app/Contents/Resources/app/extensions/html/

Note that there will already be some extensions, so instead of copying and pasting code snippets into the option, just add the extension you want to add to the arrays of extensions and aliases:

 { "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", "ejs" ], "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" }] }, "extensionDependencies": [ "html" ] }