Best way to use ES Modules in Node.js as of today

kau

Kaushik Evani

Posted on July 14, 2019

Best way to use ES Modules in Node.js as of today

The other day I started to write a basic server for some hobby project in Node.js and realised that I had gotten pretty used to using ES style module imports, and that the lack of it in Node.js was irksome. This post is a result of my subsequent research into it.

What Node.js says you can do

In the current stable version of Node.js (10.16), the ES modules are in "experimental" feature. Therefore to use it, you would have to use the
--experimental-modules flag and the file should be saved with a .mjs extension.

$ node --experimental-modules app.mjs

In the latest release of Node(12.6), you can keep the extension of the file as .js but add "type": "module" in the nearest package.json. For more info check here

Problems with this

The ES modules and the CommonJS modules are mutually exclusive. You cannot mix and match require and import in a .mjs file. The obvious problem here is when you have existing boilerplate node_module requires, all of which you have to update to something like import * as ...

For example, if I wanted to import my api handlers the ES module way and leave the other boilerplate as it is, it WILL NOT WORK.

    var express = require('express')
    var router = express.Router();
    import { GetHandler, PostHandler } from './handlers';

    router.get('/:id?', GetHandler);
    router.post('/', PostHandler);

    module.exports = router
Enter fullscreen mode Exit fullscreen mode

Even if you have a medium sized project, you would end up spending a lot of time changing requires and file names for a lot of files, which is just not right.

One solution

Use babel.
We've all been using babel for front-end projects forever. But for the server-side, we don't have to worry about developing for different target browsers etc. You'll most likely be using one of the recent versions of Node and therefore only have to transpile down to that. But even then I felt babel is a bit of an overkill for what we are trying to achieve here.

Best solution for this use case: Sucrase (github)

"Sucrase is an alternative to Babel that allows super-fast development builds."

Sucrase doesn't cater to all use cases. It assumes you are developing for recent versions of the browser or Node.js and therefore does only a subset of the work babel does, making it automatically faster. According to them it is 20x faster than babel!

Here's a dev.to article on sucrase

For more info, see their github page.

So for our use case, all we need to do, is use the sucrase require hook at the top of our app, and we are good to go!

    // server.js
    require('dotenv').config()
    if (process.env.NODE_ENV === 'development') 
        require('sucrase/register');

    const express = require('express')
    let app = express()
    const port = process.env.PORT;

    /**
     *  OTHER SERVER CODE
     */

    app.listen(port, () => console.log(`Server listening on port ${port}...`));

Enter fullscreen mode Exit fullscreen mode
WARNING! It is not advised to use require hooks in production. For production, use the sucrase cli.
💖 💪 🙅 🚩
kau
Kaushik Evani

Posted on July 14, 2019

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related