Bug description
deck.gl aggregated charts fail with "ReferenceError: module is not defined"
Description
All deck.gl aggregated chart types (Grid, Contour, Hexagon, Screengrid, Heatmap) fail to render with a ReferenceError in a fresh Superset installation.
The error message indicates that module is not defined, suggesting a potential module loading or bundling issue.
### Expected Behavior deck.gl aggregated charts should render properly when selected from the chart list.
### Actual Behavior When opening any deck.gl aggregated chart, the visualization fails with: Data error An error occurred while rendering the visualization: ReferenceError: module is not defined
### Steps to Reproduce
1. Fresh install of Superset using Docker Compose
2. Run docker compose up
3. Navigate to Charts list
4. Select any of the following chart types:
- Grid
- Contour
- Hexagon
- Screengrid
- Heatmap
5. Observe the error message
### Screenshots
### Additional Context - The issue appears to be specific to deck.gl aggregated charts - The error suggests a JavaScript module loading issue, possibly related to webpack configuration or deck.gl library integration - This occurs on a clean installation with no custom configurations
### Possible Root Cause The error "module is not defined" typically indicates: - Missing webpack configuration for deck.gl modules - CommonJS/ES6 module compatibility issues - Missing polyfills or module loaders - Incorrect bundling of deck.gl dependencies
Screenshots/recordings
No response
Superset version
master / latest-dev
Python version
3.10
Node version
18 or greater
Browser
Chrome
Additional context
No response
Checklist
- [x] I have searched Superset docs and Slack and didn't find a solution to my problem.
- [x] I have searched the GitHub issue tracker and didn't find a similar bug report.
- [x] I have checked Superset's logs for errors and if I found a relevant Python stacktrace, I included it here as text in the "additional context" section.
Comment From: dosubot[bot]
This error is most likely caused by a version mismatch among the deck.gl dependencies in Superset, which can cause webpack to resolve to a UMD/Node-style bundle that expects a Node.js module object to exist in the browser. Specifically, the legacy deck.gl plugin lists versions like @deck.gl/aggregation-layers@^9.1.12, @deck.gl/core@^9.0.37, @deck.gl/layers@^9.0.38, and @deck.gl/react@^9.1.4—these are not aligned, and the caret (^) allows npm/yarn to resolve to different minor/patch versions, which can trigger this issue if the resolved versions are not fully compatible or if one resolves to a UMD build instead of ESM. This is a common cause of the "ReferenceError: module is not defined" error in browser builds when a dependency expects a Node/CommonJS environment but is loaded in the browser instead [source].
To resolve this, make sure all deck.gl dependencies in your package.json are pinned to the exact same version (for example, 9.0.34 for all deck.gl packages), then delete your node_modules and lockfile, and reinstall. This will ensure webpack only bundles the ESM versions and avoids the UMD fallback that causes the error. There is no evidence of a fix for this in recent PRs or in the webpack config [source].
To reply, just mention @dosu.
How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other
Comment From: msyavuz
This is also happening in Calendar Heatmap charts
Comment From: amaannawab923
ReferenceError: module is not defined at eval (utils.js:4:151) at eval (utils.js:4:161) at ./plugins/legacy-preset-chart-deckgl/node_modules/@deck.gl/aggregation-layers/dist/common/aggregator/gpu-aggregator/utils.js (plugins_legacy-preset-chart-deckgl_src_layers_Grid_Grid_tsx-data_image_svg_xml_charset_utf-8_-f3bc2a.73789528.chunk.js:158:1) at webpack_require (spa.1ed71cbe.entry.js:1711:32) at fn (spa.1ed71cbe.entry.js:2047:21) at eval (webgl-bin-sorter.js:6:67) at ./plugins/legacy-preset-chart-deckgl/node_modules/@deck.gl/aggregation-layers/dist/common/aggregator/gpu-aggregator/webgl-bin-sorter.js (plugins_legacy-preset-chart-deckgl_src_layers_Grid_Grid_tsx-data_image_svg_xml_charset_utf-8_-f3bc2a.73789528.chunk.js:188:1) at webpack_require (spa.1ed71cbe.entry.js:1711:32) at fn (spa.1ed71cbe.entry.js:2047:21)
Here's the exact stack trace ... It specifically comes from aggregation layers node module
@msyavuz @richardfogaca
Comment From: richardfogaca
thank you @amaannawab923 I've opened a PR with the fix for this issue: https://github.com/apache/superset/pull/34690
Comment From: rusackas
Thanks for the PR @richardfogaca