DevotionGeo

DevotionGeo

Erlang Blog Post: Formatting your Erlang code in Visual Studio Code

There are 3 main formatters for Erlang which you can use from the command-line,

Visual Studio Code’s extension called Erlang Formatter uses these formatters to format Erlang code on save or when the shortcut keys combination is pressed which is Shift + Alt + F on Windows, Shift + Option + F on Mac and Ctrl + Shift + I on Linux.
(Note: the erlang extension also tries to format Erlang code, but it wasn’t working for me, and it doesn’t have any setting to set the desired formatter).

Following were the steps I used to make it work (all the settings and instructions can be found at Github READMEs of Erlang Formatter for VSCode and rebar3_format, and the Getting Started Page of rebar3, but I’m trying to make it a tiny bit less confusing than how I found it).

  1. Install rebar3:
    If you already have Elixir installed, chances are that there is a rebar3 binary somewhere in that installation. Mine was at ~/.asdf/installs/elixir/1.10.4-otp-23/.mix/rebar3 as I use asdf for version management. In that case you can run the following command, replacing the path with the path to rebar3 on your machine, or can go to the directory where rebar3 is located and run as ./rebar3.
    ~/.asdf/installs/elixir/1.10.4-otp-23/.mix/rebar3 local install

    Then add export PATH=$PATH:~/.cache/rebar3/bin to your .bashrc or .zshrc. And after that run the second command as,
    rebar3 local upgrade
    (this time you don’t need to add ./ or the complete path to the command, as rebar3 (the new copy) is already installed to ~/.cache/rebar3/lib and is added to the path).

    Alternatively you can run the following commands to install from sorce.
    git clone https://github.com/erlang/rebar3.git
    cd rebar3
    ./bootstrap
    ./rebar3 local install
    Don’t forget to add export PATH=$PATH:~/.cache/rebar3/bin to your .bashrc or .zshrc.

  2. Create a rebar.config file under ~/config/rebar3/ or simply run the following comand in the terminal.
    code ~/.config/rebar3/rebar.config
    which will open a rebar.config file under ~/.config/rebar3/ in vscode.
    Add the format configuration to this file. You can find the configuration options at the rebar3_format README at Github.
    Following is my rebar.config (notice the comments).

{plugins, [rebar3_format]}.
{format, [
    % {files, ["src/*.erl", "include/*.hrl", "test/*.erl"]},
    {files, ["**/*.erl"]},
    {formatter, default_formatter},
    {options, #{
        % paper => 100,
        % inline_qualified_function_composition => true,
        % inline_simple_funs => true,
        % inline_items => all,
        % inline_attributes => all,
        % inline_expressions => true,
        inline_clause_bodies => true
    }}
]}.
  1. Install the VSCode extension Erlang Formatter, if not installed already, and add the following settings to your settings.json.
  "[erlang]": {
    "editor.tabSize": 4,
    "editor.defaultFormatter": "szTheory.erlang-formatter",
    "editor.formatOnSave": true
  },
  "erlangFormatter.formatter": "rebar3_format",

I wanted to have a 2 spaces tab size for Erlang, but looks like it’s a setting of rebar3_format which can’t be overridden, so I set it to 4 spaces in the editor too, so that the indent guides don’t look off.

(Note: feel free to edit this post).


Posted via Devtalk (see this thread for details).

Where Next?

Popular in Blog Posts Top

psantos
Just wrote a new blog post about how to deploy a Phoenix app using Kamal 2. Check it out and let me know what do you think: https://blog...
New
paulanthonywilson
All a bit meta, but this is a quick post on creating a Jekyll blog post from a Livebook page. Posted via Devtalk (see this thread for ...
New
danschultzer
How to set up the Content Security Policy header with Phoenix LiveView and support inline styles and scripts with CSP nonces.
New
alvises
Just published the first part of series of articles aimed to explain the architecture behind a kv-store engine written in Elixir and impl...
New
New
ragamuf
Does the world need another How to create a blog article? Maybe not. But then again, creating something out of nothing is what we love....
New
T0ha666
In this article, we discuss how to create a Docker image for a Phoenix application. https://t0ha.ru/en/devops/elixir/2023/11/10/how-to-b...
New
axelson
I describe how we use Hot Reloading with Webpack to develop faster and show how to integrate Webpack 5, webpack-dev-server, and Phoenix f...
New
wmnnd
Here’s the story how one of the world’s first production deployments of LiveView came to be - and how trying to improve it almost caused ...
New
lawik
Building on other people’s work I bashed things together and suddenly I can know when someone is speaking using Elixir and Membrane.
New

Other popular topics Top

aadeshere1
I have a another noob question about loop. Since elixir is immutable, while loop is not directly possible. total = 10 while total != 0 ...
New
mcarvalho
What is the difference between System.get_env and Application.get_env? For example, what are best practices to use one versus another.
New
chrismccord
Phoenix 1.4.0 released Phoenix 1.4 is out! This release ships with exciting new features, most notably with HTTP2 support, improved deve...
688 30877 112
New
johnnyicon
Hi all, I’ve just started learning Elixir and Phoenix Framework, so please pardon my n00bness at this stage. I’m trying to use Postgres...
New
jerry
Good day to you all. I have been struggling to get a query involving like and ilike to work. Can anyone assist me on this, please? pro...
New
jay1
Why is it that the mnesia database isn’t the most preferred database for use in Elixir/Phoenix?
New
nobody
Hi! In PHP: $_SERVER[‘SERVER_ADDR’] - in Elixir? Searched the docs for ip address and the web, no good results. Thanks!
New
jason.o
In the code below, if the create action is not set to accept “extra_key” as an input, it errors out with a message shown above. Is there ...
New
svb
Hi! Currently I want to submit a form by pressing the Enter key. However, since my input field is of type “textarea” this is just adds a...
New
lanycrost
Hi everyone! I need implement if…else if…else condition from my elixir code, and anymore of this control flow structures not work proper...
New

We're in Beta

About us Mission Statement