trellis icon indicating copy to clipboard operation
trellis copied to clipboard

ERR_REQUIRE_ESM when importing WebGL renderer

Open brianlove opened this issue 1 year ago • 1 comments

I'm trying to add a Trellis-based graph within a Nuxt/Vue website. When I try using the most recent 0.6.1 release I get the error described in #81 (this also happens in the 0.7.0 RCs). However, when I try 0.6.0 I get the following ESM error instead:

[Vue Router warn]: uncaught error during route navigation:
Error [ERR_REQUIRE_ESM]: require() of ES Module /PROJECT_PATH/node_modules/d3-color/src/index.js from /PROJECT_PATH/node_modules/@sayari/trellis/renderers/webgl/utils.js not supported.
Instead change the require of index.js in /PROJECT_PATH/node_modules/@sayari/trellis/renderers/webgl/utils.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (/PROJECT_PATH/node_modules/@sayari/trellis/renderers/webgl/utils.js:4:18)
    at Object.<anonymous> (/PROJECT_PATH/node_modules/@sayari/trellis/renderers/webgl/node.js:66:15)
    at Object.<anonymous> (/PROJECT_PATH/node_modules/@sayari/trellis/renderers/webgl/index.js:52:14) {
  code: 'ERR_REQUIRE_ESM'
}

Interestingly, version 0.6.0 works just fine in another (Svelte-based) project that I created last year (originally 0.4.3, but recently updated).

brianlove avatar Nov 13 '23 07:11 brianlove

I've determined that this issue is a Trellis–Nuxt interaction, and not an issue with Vue itself - a basic Vue app works just fine when using Trellis 0.6.0 (it fails with the issue from #81 when using later versions), but a basic Nuxt app fails with this error when using 0.6.0. I've created a repo with two basic demo apps demonstrating these issues at https://github.com/brianlove/trellis-errors-nuxt-vue

brianlove avatar Nov 17 '23 04:11 brianlove