how to add file extension in adobe-brackets editor ?

Question

I am using files with .html.eco extension in my web project and I am trying to edit in Adobe Brackets but I can't specify that it should treat this as HTML file, to provide the typical features of editing html file (like color support, grammar, etc.).

In fact I noticed that this is possible when changing languages.json file, however I am using the binary version and I didn't build from source.

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

Any help ?

Answer 1

Update: this is now much easier to do:

1. Open the .html.eco file
2. In the status bar (lower-right), click the dropdown that says "Text"
3. Select the "HTML" option
4. Open the dropdown again and select the "Set as Default" option at the top

---

Original answer:

There's a backlog item for making this easily configurable (please upvote!), but in the meantime you can do it by writing a very simple Brackets extension:

define(function (require, exports, module) {
    var LanguageManager = brackets.getModule("language/LanguageManager");
    var language = LanguageManager.getLanguage("html");
    language.addFileExtension("html.eco");
});

1. Put this code in a file named main.js
2. In Brackets, go to Help > Show Extensions Folder
3. Create a new folder under user, and place the main.js file inside it
4. Restart Brackets

Here's more info on writing Brackets extensions, if you're curious.

Answer 2

The approach referenced using the status bar menu does not persist across sessions. An option to persist settings across all projects and all sessions is easily accomplished by editing the preferences file (accessible through the Debug menu) and associating the file extension to the desired language.

Debug -> Open Preferences File

{
    "language.fileExtensions": {
        "html.eco": "html"
    }
}