Hello,
Should the command Code > Reformat code (Ctrl-Alt-L) oder Code > Auto-Intend Lines (Crtl-Alt-I) work with .html.eex files when using IntelliJ plugin intellij-elixir? If yes, do I have to change or set up anything?
Sorry if I should have posted in the IntelliJ Elixir - Elixir plugin for JetBrain’s IntelliJ Platform topic.
Thanks,
Peter
The formatter is registered for Elixir
not EEx, so I think if it works at all, it would format the Elixir inside the EEx tags.
I’m not sure how formatting a whole file works since the outer (HTML) needs to be formatted, then the template tags (EEx) and then the inner (Elixir). IntelliJ Ultimate Edition, WebStorm, PHPStorm, and Rubymine have HTML formatters I think, so they should format the HTML, but I don’t think HTML support is in IntelliJ Community Edition.
So, maybe I need to register a formatter for EEx too, but I’m not sure how that would work since you can put the tags wherever, like to interpolate an attribute or even seemly invalid, partial HTML and that formatting would be dependent on the outer language.
Which IDEs have you tried Auto-Indent Lines in?
@KronicDeth Thanks for your reply.
I’m using IntelliJ Idea’s Ultimate Version. Trying ‘auto-intend lines’ and nothing happens on html.eex files. Can I register a formatter for EEx myself?
FWIW I use Rubymine for editing Elixir/Phoenix code. I had to add *.html.eex under eex to get it to treat those as both HTML and EEX for highlighting and Zen coding HTML. However it will not respect the Elixir blocks that span <%= %> tags for reformatting or indenting. I’ve just been applying the formatting manually. I wasn’t sure if this was just a small-IDE thing or not until I saw your post. Maybe it does need a formatter registered since, unlike .ex or .exs files, the code it separated by tags in .html.eex.
It also complains that it can’t find the definition/assignment of the assigns variables and doesn’t bold the name (@current_user, etc), but that’s just a minor inconvenience.
For the most part, the plugin is awesome. Kudos to @KronicDeth for all of the great work and being so responsive to questions.
Love the Elixir plugin so much, except for this. It’s driving me crazy that I can’t format HTML files, I’ve tried fiddling with all the options in IntelliJ and it seems to just completely ignore indenting for .html.eex files no matter what I do.
Thanks for the plugin though @KronicDeth
edit: just found the best work-around: rename the file to .html for a second, reformat it, rename it back to .html.eex
I am using PhpStorm and got it working with adding *.html.eex under the Editor > File Types > Twig. As it has a similar template language style, it works like a charm.
If anyone ever finds a better solution than the Twig file type, please please please tell me here. It’s still driving me crazy because now I basically have the option which language it’s properly formatting but not both…
The Elixir plugin was recently updated to provide better formatting (as of v11.8.0). It will now use the underlying language for eex files, meaning *.html.eex files will be formatted as HTML. Unfortunately, this still won’t format both Elixir and HTML at the same time. An example of what I mean:
<html>
<body>
<div>
<%= if true do %>
<p>Hallo</p>
<% end %>
<p>Test</p>
</div></body></html>
will be formatted as:
<html>
<body>
<div>
<%= if true do %>
<p>Hallo</p>
<% end %>
<p>Test</p>
</div>
</body>
</html>
As you can see, the content inside the if was not indented.
I’m using it with Rubymine and if you add *.html.eex and set the template language to HTML, it formats both the HTML and Elixir as you can see below. This has been my pet peeve for a while but seems to be resolved with the latest update!
On your screenshot you have set the language of *.html.eex to Embedded Elixir, no?
Your highlighting seems correct (in contrast to @niknetniko’s answer). Is that Rubymine specific? Because I want that! 
That should happen automatically. The highlighting is broken since it’s a code snippet, it works fine in Intellij for me:
My file types:
Yes, exactly. Select the Embedded Elixir file type and click the + sign. It will ask you for the template language and select HTML. Obviously, you’ll need to do the same for *.html.leex if using LiveView templates too. Once I do that, the syntax highlighting works and even the Emmet shortcuts for building HTML elements!
It may be RubyMine (or any small IDE) specific. I don’t have IntelliJ on this machine to check.
EDIT: Found an update, everything works now. Woohoo!
This is amazing. Not perfect yet, but definitely awesome.
I just donated a coffee to @KronicDeth. Thank you so much! 
FYI: The link if anyone else is interested: https://github.com/KronicDeth/intellij-elixir#donations
Thank you, @joe, but I can’t take the credit. The formatter change was actually a community contribution from https://github.com/niknetniko. All I did was the review and merge on that one.
Sadly the autocompletion for both html feels a lot worse than it did when I had set it to twig.
When I type <div cl it used to create the rest for me <div class=""></div>.
Also my live template didn’t work anymore.
The workaround was to create it in the elixir language section and make it available for html files at the bottom.
Maybe this will help someone.
If you have an idea how to get my html autocompletion back, please share it with me.
Maybe I should make my template language into something else than html? Or change all live templates of zen html and zen css to be applicable in elixir files?
Do you get auto completion for tailwind?
© Copyright Elixir Forum | Terms | Privacy & Cookies
