The new Indium
Now that Indium 2.0 is around the corner, it’s about time to write this post!
You can see this article as the third part of my series of articles describing how to make Emacs a JavaScript development environment. If you haven’t read it yet, you should jump to the first and second post first to get started.
About Indium 2.0
Indium 2.0 is not out yet, but if you’re installing Indium from MELPA, you’re already using it.
Indium is a JavaScript development environment for Emacs. It connects to a runtime (Browser or Node), and provides things like a REPL, inspector, live evaluation, and of course a stepping source debugger.
New project configuration
The upcoming release of Indium will feature much better project configuration with sourcemap support for most, if not all JavaScript projects, including React, VueJS, Meteor, Angular, and basically any project that uses Webpack or other bundlers that produce sourcemaps.
New client/server architecture
The new Indium will also be based on a client/server architecture, and will require the installation of the indium server like the following:
npm install -g indium
There are several reasons for this change, the most important one being the ability to reuse existing JavaScript libraries for handling WebSockets, source-maps and the Chrome Debug Protocol.
You can read the documentation of the new TCP protocol here.
As a result, Indium will be much more responsive.
Setting up Indium
Let’s start with the creation of a React project built with the CLI tool
create-react-app
.
sudo npm install -g create-react-app
create-react-app my-app
cd my-app
npm install
npm start
We need to tell Indium how to connect to our new project my-app
. To do
that, let’s create a .indium.json
file at the root of the project:
{
"configurations": [
{
"name": "Web Browser",
"type": "chrome",
"url": "http://localhost:3000"
}
]
}
We only need one configuration, but Indium supports any number of configurations per project, including mixing NodeJS and Chrome.
Firing up Indium
To start Indium, you can either do M-x indium-connect
to connect to a running
JavaScript process (Chrome tab the example above), or do M-x indium-launch
to
start a new process and automatically connect to it.
For more information about setting up and starting Indium, read the Getting up and running section of the documentation.
Closing words
The new architecture of Indium is brand new, and I expect issues to be discovered. You can open issues on the GitHub issue tracker (please do!).
If you are unsure how to best report an issue for Indium, there’s a section in the manual for that!