HEEx

コンパイル時に構造上の問題がないかまでチェックできる。HTMLのspecに合っているかまではチェックしない。

code:elixir

~H"""

<div class={@class} title="My div">

<SomeModule.some_func_compoent attr1="some string" attr2={@some_expression} {@other_dynamic_attrs}>

<.some_local_func_compoent attr1="some string">

</div>

"""

2021/8/16時点ではWIPとなっているけれども一応使うことができる

code:console

$ cd vscode-phoenix

$ npm install

$ vsce package

$ code --install-extension phoenix-0.1.0.vsix

code:setting.json

{

...

"emmet.includeLanguages": {

...

"phoenix-heex": "html"

},

...

}