Best way to use ES Modules in Node.js as of today
Tags: node, es6, javascript, sucrase
Published: 2019-07-14 19:25:12

---
title: Best way to use ES Modules in Node.js as of today
published: true
description:
tags: Node, es6, javascript, sucrase
cover_image: http://www.guptagalaxygroup.com/data1/images/banner3.jpg
---

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](https://nodejs.org/dist/latest-v12.x/docs/api/esm.html#esm_ecmascript_modules)

### 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
```
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](https://github.com/alangpierce/sucrase))

"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

{% link https://dev.to/iriskatastic/sucrase-is-a-super-fast-alternative-to-babel-4ih0 %}

For more info, see their [github](https://github.com/alangpierce/sucrase) 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}...`));

```

##### WARNING! It is not advised to use require hooks in production. For production, use the sucrase cli.