text editor – How to add a file extension to Adobe Brackets Supported Extensions List?

Question:

I'm using files with html.eco extension in my WEB project and I'm trying to edit in Adobe Brackets, but I can't specify that it should treat these files as HTML sources. I would like Brackets to provide me with the typical HTML file functionality (like coloring the font, tagging the grammar, etc.)

I actually noticed that this is possible when changing the languages.json file, but I'm using the binary version and I haven't built it from sources.

https://github.com/adobe/brackets/blob/master/src/language/languages.json

I would just like to change some Brackets property or configuration file to be able to edit my .html.eco files so that it understands that it is mime-type text/html

Answer:

  1. Open the file: Brackets\www\editor\EditorUtils.js

  2. Add the corresponding extension inside the switch (ext)

For example:

 switch (ext) {
    ...
    case "eco":
        return "htmlmixed";
    ...

Source: http://zsitro.com/how-to-extend-adobe-brackets-language-support-based-on-file-extension/

Searching further, I found the supported language definitions in language/languages.json in the current Brackets code:

"html": {
    "name": "HTML",
    "mode": ["htmlmixed", "text/x-brackets-html"],
    "fileExtensions": ["html", "htm", "shtm", "shtml", "xhtml", "cfm", "cfml", "cfc", "dhtml", "xht", "tpl", "twig", "hbs", "handlebars", "kit", "jsp", "aspx", "asp", "master","cshtml","vbhtml"],
    "blockComment": ["<!--", "-->"]
},

And through LanguageManager we can dynamically add a new extension to the list:

var language = LanguageManager.getLanguage('html');
LanguageManager.addFileExtension('eco');

It remains to be seen now where exactly to make this code run – if you need a "plugin" just for that (avoiding build from sources), or if otherwise.

Post Views: 0
Scroll to Top