Deck.gl: ESM build doesn't work

[phaux]

1. it uses node module assert
2. it uses module.exports instead of export statement in @deck.gl/core/dist/esm/utils/globals.js:

module.exports = {
  window: typeof window !== 'undefined' ? window : global,
  global: typeof global !== 'undefined' ? global : window,
  document: typeof document !== 'undefined' ? document : {},
  isBrowser: isBrowser
};

[ibgreen]

@phaux Thanks for reporting.

it uses node module assert

Hmm, this shouldn't be happening. We have a local version of assert that gives use the same functionality. I quickly checked the code in deck.gl and as far as I can tell it uses the local version. Might be through a dependency, will need some more investigation

Not quite sure why/how this breaks things for you though. Bundlers like webpack and browserify have a browser version of assert, so things should still work (at a small bundle cost).

it uses module.exports instead of export statement in @deck.gl/core/dist/esm/utils/globals.js

This should be fixable. But again, not clear why this breaks your code. Almost all ESM code is used together with older style exports, why is this an issue for you?

[danmarshall]

I am using Rollup as a bundler and I am experiencing a similar issue.

In the distribution, this file node_modules\@deck.gl\core\dist\esm\lib\init.js contains both import staements and a require statement. According to this comment :

The issue here is that you can't mix require and import/export. This plugin only transforms CommonJS modules, and if you have an import or export declaration it means that the file is an ES module, not a CommonJS one.

Here is a sample repo to illustrate the issue: https://github.com/danmarshall/deckgl-rollup

The runtime error is:

Uncaught ReferenceError: require is not defined

Which occurs from the line:

require('../shaderlib');

[ibgreen]

I know that on a few occasions we intentionally use require instead of import to make sure that code just before the require executes before the file is imported (import and require have different semantics in this regard).

I realize that this is frowned upon, and it would be best to avoid, but has never been an issue before and in some cases is not trivial to refactor.

Without having checked further I suspect this could be the case here (or maybe it was the case, but perhaps this is no longer needed).

Before we dig in: We don't use rollup but by the sound of it making this file use either all requires or all imports would fix it?

On a side note, tt would be great if someone contributed an examples/get-started example for rollup that would help us keep support for that bundler working.

[danmarshall]

@ibgreen I'm happy to contribute an example, once I get it working. Additionally, I can add an example for Parcel as well, pending deployment of the next version with this bug fix.

[Pessimistress]

@ibgreen we may need to do a similar thing here https://github.com/uber/react-map-gl/commit/aeed2db2497ec01a2a7ea6bf3aea275fb0fae816#diff-aaa714295b5ada275a18366fc0bad4c7

[phaux]

Not quite sure why/how this breaks things for you though. Bundlers like webpack and browserify have a browser version of assert, so things should still work

I was importing ESM build directly using script type=module. Then I tried rollup with ESM output but it still didn't work.

[Pessimistress]

module.exports is removed in 6.3.8

[danmarshall]

@Pessimistress awesome! Are the require statements also removed?

[Pessimistress]

Hmm no. Sorry just saw your follow up comment. I'll test and patch.

[Pessimistress]

@danmarshall try 6.3.9

[danmarshall]

@Pessimistress the require('../shaderlib'); is removed 🥇 but there is still a require('./init'); for luma.gl
Can be seen in source here