[question] Levelup, React and ES6?

[fergiemcdowall]

Like many Front End Engineers I have to do everything in React these days.

One of the great things about levelup is that you can pair it with level-js in order to run it in a browser. Up until now I have being doing this by making node-style React apps with require and then browserifying everything.

However since React uses ES6 modules by default, it seems like the best way to incorporate a levelup instance into a browser app would be to somehow get it as an ES6 module. This would have the advantage that it could be plugged straight into the supported tooling that comes from the React project

So- is levelup available as an ES6 module?

[vweevers]

import levelup from 'levelup'

Should work. It's not an ES6 module, so you can't do tree shaking etc, but it works.

[fergiemcdowall]

Thanks! Now I feel a bit embarrassed for not just trying it :)

[vweevers]

No worries! Good to close?

[fergiemcdowall]

Yes! :)

…

-- Apologies for brevity- this message was sent from my mobile

On 22 Nov 2018, at 13:19, Vincent Weevers ***@***.***> wrote: No worries! Good to close? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or mute the thread.

[fergiemcdowall]

@vweevers I've been banging on this off and on for a few weeks now, and I still can't get level or level-browserify to compile with Rollup or Webpack. Browserify works really well, but unfortunately doesn't compile to ES6.

Frontend build tools are a bit of a rabbit hole, and I am no expert- so perhaps there is somebody here who knows the exact incantation to get level working in a browser based ES6 environment? Or perhaps level itself needs a little tweak?

Either way, some documented way to make level play nice with browsers and ES6 would be really nice to have™!

Until then: maybe reopen this issue or one that is similar?

[vweevers]

@fergiemcdowall could you provide a minimal example repo that we can install and (try to) run?

[vweevers]

Browserify works really well, but unfortunately doesn't compile to ES6.

The feature you're missing is browserify/browserify#1186, correct? Or is it about more than just imports?

[vweevers]

It seems level@next works fine with webpack at least: level-with-webpack-test (clone, npm i, npm run build, open index.html).

[fergiemcdowall]

@vweevers thanks for taking the time to throw that example together so quickly! Yes, your example using level@~5.0.0-0 works here as well

(The current level@4.0.0 doesn't seem to want to play nice with webpack or rollup, but so long at 5 works its no problem)

[vweevers]

To be clear, before level@next, level did not work in browsers, and you had to combine levelup and level-js yourself, or use level-browserify. I'm curious to know why that didn't work for you. It's possible that levelup, when used by itself, doesn't work with es6 imports. Lemme try that as well.

[vweevers]

It's possible that levelup, when used by itself, doesn't work with es6 imports. Lemme try that as well.

Also works: https://github.com/vweevers/level-with-webpack-test/tree/levelup

[vweevers]

And level-browserify also works: https://github.com/vweevers/level-with-webpack-test/tree/level-browserify