using web-worker in react

Question

// here is my web-worker code

import * as d3 from 'd3';
// import d3 from 'https://d3js.org/d3-collection.v1.min.js';
// importScripts('d3');
//fibo.worker.js
// eslint-disable-next-line import/no-anonymous-default-export
export default () => {
  // eslint-disable-next-line no-restricted-globals
  self.onmessage = (message) => {
    const { nodes, links, width, height } = message.data;
    const simulation = d3
      .forceSimulation(nodes)
      .force(
        'link',
        d3
          .forceLink(links) // This force provides links between nodes
          .id((d) => d.id) // This sets the node id accessor to the specified function. If not specified, will default to the index of a node.
          .distance(10)
      )
      .force('charge', d3.forceManyBody().strength(-500)) // This adds repulsion (if it's negative) between nodes.
      .force('center', d3.forceCenter(width / 3, height / 3))

      .force(
        'collision',
        d3.forceCollide().radius((d) => d.radius)
      );

    postMessage(simulation);
  };
};

I'm getting an error

Uncaught ReferenceError: d3__WEBPACK_IMPORTED_MODULE_0__ is not defined at self.onmessage

Answer 1

cause by: import * as d3 from 'd3'; remove this and use @ts-ignore