Making a library that can target node and browser


#1

Advice sought!

I have SafenetworkJS working with Node 8 and have just begun to package it for web using webpack, but am hitting a problem at runtime for which the online solutions seem to be to use export default ... instead of module.exports = ... (i.e. adopting ES6 style module export syntax). But looking at Node v8 through v11 it does not support this (only require() for import and module.exports for export). I’m a bit confused because even this comprehensive Node ES compatibility table doesn’t mention import or export so I think I might be misunderstanding something here. Beware: possible n00b errors! :blush:

Initial research suggests one solution to that would be to use a transpiler like babel or rollup to generate a CommonJS build from ES6 sources. This might be a good idea because I can use more up to date features in my code, but adds a new build step that I’ve not needed so far while developing for nodejs (ie SAFE Drive / SAFE CLI).

What do people recommend?

Also, if I build a CommonJS library, how to I get my nodejs app to pick that up rather than the source - does it look for a particular subfolder?


#2

Have you come across Browserify yet? (http://browserify.org/) I think it solves exactly the problem you describe with require(). Their homepage:

Browsers don’t have the require method defined, but Node.js does. With Browserify you can write code that uses require in the same way that you would use it in Node.


About the latest ECMA features (e.g. ECMA2018/ECMA2019?), I would wait until it’s necessary or if you have a nice feature that you absolutely would love to use.


#3

Thanks Benno, require() is not the cause of the problem I’m having. I think webpack is the new browserify , as in it does that and lots of optimisations, manages transpilers and so on. Still n00b level here though, I usually just steal something and tweak it!

I’m going to try changing to export default or maybe just not use the default to start. So long as I don’t break SAFE Drive I’ll be happy! :wink:

SAFE Drive has become my test suite for safenetworkjs :grinning:


#4

@happybeing you are right, webpack is the new browserify!

You want to take a look at incorporating babeljs(https://babeljs.io/) into the webpack build process as this will handle transpiling your js so you can use module imports or require statements as you please!

edit:

Read to the end of the post where you note babel :doh:. haha. Yeh, this is the way forwards IMO. You can set build targets within webpack to ensure things are exported properly for each platform too.

We use babel in house (I’ve used it by default for most things I’ve started in the last years). It’s a decent and very well documented way forward IMO.


#5

I know it’s not the cause, I meant the problem that you can’t have both require() and module.exports according to the GitHub issue.

Anyway, again, Browserify does exactly what you want. Webpack is much more complex than Browserify because it can do a lot more things. Browserify solves one problem and does it well; it’s easy to use. If you need optimisations and transpilers, sure: use Webpack!


#6

Thanks fellas, all useful input, I appreciate you giving me your time and insights.

For now I’m just dropping module.exports = (ie no default) so I can avoid having a build step at all for node apps and it has done the trick :slight_smile:

I didn’t realise it was just the default export that was the problem until waking up this morning.

At some point I’ll move to ES6 but laziness won today :wink: and if I wait long enough bud will support it natively :trophy: :trophy: :trophy: