My impressions after trying to use ES Modules in 2018  
Tags: node, es6, webdev, javascript
Published: 2018-08-22 01:58:01

---
title: My impressions after trying to use ES Modules in 2018  
published: true
description: A brief description of my attemps to use ES Modules on different projects. 
tags: #nodejs #es6 #webdev #javascript
---

**TLDR** 
Support is still experimental. Most things work as expected out of the box with a Front End application, but it had a lot of issues with Node libraries and while testing with Enzyme.

You can use them right now, but we are not there yet.

## Introduction
As an ever learning developer, I'm always trying to keep up with the latest ES features and all relevant technologies on the web.

I want to tell you about two pet projects where I tried to use them and the problems that I've encountered.


## Proyect 1 React, Redux Firebase Application
So I tried to migrate my app from *create-react-app* to something that used Parcel and supported ES Modules out of the box. Everything worked great, I just changed `index.js` to `index.mjs`. I feel like living in the future, and this is what my project looked like: 


![Tweet screenshot](https://thepracticaldev.s3.amazonaws.com/i/qo0qci3t8421v2s5es9r.png "Tweet screenshot")

The problems arrived when I tried to integrate unit tests, I'm not sure if there is something wrong with Jest or if Parcel requires some additional configuration. What bugs me is that it is supposed to be a *Blazing fast, zero configuration web application bundler*, for the most part if is. I gave it a day, and I wasn't able to solve it, so I decided to move to [`react-boilerplate`](https://github.com/react-boilerplate/react-boilerplate), which I really loved.


## Proyect 2 The app for my puppeteer series blog post
[*Here is the post link if you are curious*](https://dev.to/papaponmx/front-end-development-automation-with-puppeteer-part-3-3pl6).

If you haven't checked it out, it is a NodeJS application that is meant to run on a desktop or CI server in order to do visual regression tests. According to [this post](http://2ality.com/2017/09/native-esm-node.html), you might not need any `webpack` nor `RollupJS` anymore. 

Double checking [the documentation](https://nodejs.org/dist/latest-v10.x/docs/api/esm.html
), since Node `v10.x` there is experimental support. If you don't know what that means, here's [a link with the explanation](https://nodejs.org/dist/latest-v10.x/docs/api/documentation.html#documentation_stability_index).

Anyway, the only thing needed is to add a experimental flag, the command looks something like this:
```
$ node --experimental-modules main.mjs

```

So again, all the files [you see in the repo](https://github.com/papaponmx/visual-regresion-test/), used to be *ES Modules*, but I had a problem trying to implement [`pixelmatch`](https://github.com/mapbox/pixelmatch). Now don't get me wrong, the library is awesome, the problem is that ES Modules support is still experimental. The problem was that the exports where not being recognized as such within my `index.mjs`.



## Conclusion
It was a nice experiment, I think using ES Modules is generally OK for most simple applications, they play nice with React, Parcel and most modern browsers in general, but if you have some external libraries it might break.

I would recommend it for pet projects, but not for the core of your next SaaS startup, not yet. Have you tried this or any other experimental features? How did it go?

Thanks for reading guys. Cheers.