ES6 Modules in Chrome & Node... `export function` or `module.exports = function`?

Question

I have a module like this:

module.exports = class Edge {
    constructor(vertex1, vertex2) {
        this.vertex1 = vertex1;
        this.vertex2 = vertex2;
    }
}

I want to import it into some NodeJS files and some front-end files in Chrome. I know Chrome now supports ES6 modules, but importing is giving me trouble:

ReferenceError: module is not defined

I think I'm supposed to use export class { ... }, but that's NOT supported in NodeJS right? How can I make this module work with both Chrome and NodeJS?

kingdaro · Accepted Answer · 2018-03-03 20:11:44Z

4

ES6 modules are currently supported under a flag, so it is possible to have your file work natively in both environments. A few important things to note:

In Node, the file has to have an .mjs extension, so Node knows beforehand to load it as an ES module instead of a CommonJS module
Browsers don't automatically search for .js or .mjs extensions. You have to add them yourself when importing, e.g. import { Edge } from './edge.mjs'

However, the technology is still new and experimental, and there's not a lot of documentation or material on the subject. That, and relying on native technology isn't a good idea if you want to support older node environments and browsers.

If you want to support older environments, you can use a tool like webpack to "bundle" up your files into one big JS file that any environment can run.

Lastly, look more into ES modules and gain a good understanding of how the syntax works in detail (defaults especially), so you'll run into less problems later.

edited Mar 3, 2018 at 20:11

answered Mar 3, 2018 at 19:54

kingdaro

12.1k3 gold badges37 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Felix Kling Over a year ago

It should be "ES6 modules are currently supported under a flag". Node has always supported "NodeJS modules".

SandeliusME · Accepted Answer · 2018-03-03 19:45:00Z

0

Use Babel and compile your code

answered Mar 3, 2018 at 19:45

SandeliusME

8221 gold badge11 silver badges19 bronze badges

4 Comments

AskYous Over a year ago

Is the only way to use a compiler?

AskYous Over a year ago

Ok. What would Babel do (I never used it)? Would it make a version for Node and a version for Chrome? 2 files?

kingdaro Over a year ago

Babel would translate the ES6 import/export statements into CommonJS to allow them to run in Node. However you wouldn't run babel for chrome, since chrome supports the ES6 syntax natively.

SandeliusME Over a year ago

Also the NPM developers have come up with a new proposal for the module system in node so it will prob take some time before it gets accepted. Babel is the only way to go atm.

Collectives™ on Stack Overflow

ES6 Modules in Chrome & Node... `export function` or `module.exports = function`?

2 Answers 2

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related