I cannot get VSCode to recognise leex and eex templates

Phoenix Forum Questions / Help
, ,
1

Hi,

I am struggling to get the VSCode editor to recognise leex and eex templates. They just come up without syntax coloring, auto-complete or any other support.

I am running macOS Catalina 10.15.4

VSCode about box says:

Version: 1.45.1
Commit: 5763d909d5f12fe19f215cbfdd29a91c0fa9208a
Date: 2020-05-14T08:33:47.663Z (2 wks ago)
Electron: 7.2.4
Chrome: 78.0.3904.130
Node.js: 12.8.1
V8: 7.8.279.23-electron.0
OS: Darwin x64 19.4.0

I am using
ElixirLS: Elixir support and debugger v 0.4.0
Beautify 1.5.0

I have disabled or uninstalled all other plugins (I think), these two are the only ones that show up as “enabled”

I have the following config in both user and workspace settings.json (I have tried various variations in files.associations:

    "files.associations": {
      "*.js": "javascript",
      "*.ex": "elixir",
      "*.exs": "elixir",
      "*.eex": "HTML (EEx)",
      "*.html.eex": "HTML (EEx)",
      "*.leex": "HTML (EEx)",
      "*.html.leex": "HTML (EEx)"
    },
    "emmet.includeLanguages": {
        "HTML (EEx)": "html"
    },
    "beautify.language": {

      "js": {
        "type": [
          "javascript",
          "json",
          "jsonc"
        ],
        "filename": [
          ".jshintrc",
          ".jsbeautifyrc"
        ]
      },
      "css": [
        "css",
        "less",
        "scss"
      ],
      "html": [
        "htm",
        "html",
        "HTML (EEx)"
      ]
    },

I expect this is something obvious I have missed but I am totally stalled. Any help appreciated! Thanks!

2

this works for me:

"files.associations": {
  "*.leex": "html"
},

in settings.json

1 Like
3

Thank you! That was annoyingly easier than I expected! :smiley:

I have made it:

  "files.associations": {

    "*.js": "javascript",
    "*.ex": "elixir",
    "*.exs": "elixir",
    "*.eex": "html",
    "*.leex": "html"
  },

and it seems to work as I would expect.

4

An alternative would be to use erlang syntax instead which is what both leex and yecc use internally. Unfortunately I don’t how to do this so I can’t help you there.

5

I think this is about live view embedded elixir, not erlangs token and parser generators source files.

1 Like
6

Personally, I would recommend:

  "emmet.includeLanguages": {
    "html-eex": "html"
  },
  "files.associations": {
    "*.eex": "html-eex",
    "*.leex": "html-eex"
  }
6 Likes
7

Besides includeLanguages, the syntaxProfiles was also needed in my case:

  "emmet.syntaxProfiles": {
    "html-eex": "html"
  }