🏠 back to Observable

Issues requiring x3dom module


#1

Hi all,

I am looking for some help with an issue I am having requiring an x3dom module in one of my notebooks:

I have already described the issue in the notes at the top of the notebook above (along with some of my notes) but in summary I am trying to load a dependency module, x3dom, into this notebook, I am trying 2 different methods each manifest themselves with different errors:

  • Ne: invalid module
  • ReferenceError: x3dom is not defined

I have already worked through Tom MacWright’s notebooks re help loading stubborn modules and had no joy:
n https://beta.observablehq.com/@tmcw/module-require-debugger
https://beta.observablehq.com/@tmcw/requiring-modules-troubleshooting

Has anyone got any other ideas?

Jim


#2

One way to avoid race conditions in the current code of your notebook is simply to give the d3X3dom cell explicit dependencies on d3 and x3dom like this:

d3X3dom = {
  d3;
  x3dom;
  return require("https://raw.githack.com/jamesleesaunders/d3-x3dom/master/build/d3-x3dom.js");
}

#3

You are a genius! Thank you @bgchen.
That works a treat.

I’d still like to get to the bottom of why the version of d3-x3dom which includes x3dom in the rollup config errors with Ne: invalid module but your fix to the race issue is at least solved and the notebook works all the time.

If anyone is an expert in my rollup/babel, this is what I have in my rollup config for the one which results in the above error:

export default {
   input: "index.js",
   output: {
      ...
      globals: { d3: "d3", x3dom: "x3dom"}
      ...
   },
   external: ["d3", "x3dom"],
   ...
}